Rewrote website copy

This commit is contained in:
2026-09-09 05:20:26 -07:00
parent 8b8441ef5b
commit 4787152192
2 changed files with 96 additions and 86 deletions
+95 -85
View File
@@ -6,7 +6,7 @@
<meta name="theme-color" content="#F4EDE3"> <meta name="theme-color" content="#F4EDE3">
<meta <meta
name="description" name="description"
content="Noel Design Atelier creates bespoke seasonal environments composed for exceptional architecture." content="Holiday installations shaped by the character of your space and the people who gather there. Enter the world of Noel Design Atelier in the Pacific Northwest."
> >
<title>Noel Design Atelier — Composing the Season</title> <title>Noel Design Atelier — Composing the Season</title>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
@@ -15,7 +15,7 @@
href="https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;500;600&amp;display=swap" href="https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;500;600&amp;display=swap"
rel="stylesheet" rel="stylesheet"
> >
<link rel="stylesheet" href="styles.css?version=logo-wordmark-scale-two"> <link rel="stylesheet" href="styles.css?version=seasonal-story-copy">
</head> </head>
<body id="top"> <body id="top">
@@ -40,7 +40,7 @@
<nav class="primary-navigation" aria-label="Primary navigation"> <nav class="primary-navigation" aria-label="Primary navigation">
<ul class="primary-navigation-list"> <ul class="primary-navigation-list">
<li><a class="primary-navigation-link" href="#work">Work</a></li> <li><a class="primary-navigation-link" href="#work">Season</a></li>
<li><a class="primary-navigation-link" href="#philosophy">Philosophy</a></li> <li><a class="primary-navigation-link" href="#philosophy">Philosophy</a></li>
<li><a class="primary-navigation-link" href="#approach">Approach</a></li> <li><a class="primary-navigation-link" href="#approach">Approach</a></li>
<li><a class="primary-navigation-link" href="#contact">Contact</a></li> <li><a class="primary-navigation-link" href="#contact">Contact</a></li>
@@ -54,7 +54,7 @@
class="site-width-boundary homepage-hero-section image-overlap-heading-dynamic-inversion-container" class="site-width-boundary homepage-hero-section image-overlap-heading-dynamic-inversion-container"
aria-labelledby="homepage-hero-title" aria-labelledby="homepage-hero-title"
> >
<p class="section-context-label">Seasonal environment design <span aria-hidden="true">/</span> Pacific Northwest</p> <p class="section-context-label">Holiday installations <span aria-hidden="true">/</span> Pacific Northwest</p>
<h1 <h1
class="homepage-hero-title image-overlap-heading-dynamic-inversion" class="homepage-hero-title image-overlap-heading-dynamic-inversion"
@@ -67,11 +67,12 @@
<div class="homepage-hero-introduction"> <div class="homepage-hero-introduction">
<span class="brand-occasion-mark" aria-hidden="true">✦</span> <span class="brand-occasion-mark" aria-hidden="true">✦</span>
<p> <p>
Luxury seasonal environments for hospitality, automotive brands, private estates, We create holiday installations that welcome you into the season. From the first
and remarkable places. glimpse of greenery to the glow beyond a doorway, each space offers a reason to
pause and stay a little longer.
</p> </p>
<a class="editorial-text-link" href="#philosophy"> <a class="editorial-text-link" href="#philosophy">
Discover our world <span aria-hidden="true">→</span> Step inside <span aria-hidden="true">→</span>
</a> </a>
</div> </div>
@@ -79,9 +80,9 @@
<div <div
class="photography-placeholder photography-placeholder-tall" class="photography-placeholder photography-placeholder-tall"
role="img" role="img"
aria-label="Grand hotel entrance dressed with architectural garlands, Christmas trees, and candlelit lanterns" aria-label="Image placeholder: hotel entrance framed by garlands, evergreen trees, and glowing lanterns"
> >
<span>Grand hotel entrance with architectural garlands and candlelight</span> <span>Hotel entrance framed by garlands and lantern light</span>
</div> </div>
</figure> </figure>
</section> </section>
@@ -99,32 +100,33 @@
<div <div
class="photography-placeholder photography-placeholder-portrait" class="photography-placeholder photography-placeholder-portrait"
role="img" role="img"
aria-label="A sweeping architectural staircase wrapped in cedar garland and velvet ribbon" aria-label="Image placeholder: cedar garland and velvet ribbon following a curved staircase"
> >
<span>Architectural staircase with cedar garland and velvet ribbon</span> <span>Cedar and velvet following the curve of a staircase</span>
</div> </div>
</figure> </figure>
<h2 class="editorial-statement-title" id="philosophy-title"> <h2 class="editorial-statement-title" id="philosophy-title">
Architecture is the canvas. The season begins
<span>The season is the masterpiece.</span> <span>with the space.</span>
</h2> </h2>
<div class="philosophy-supporting-copy"> <div class="philosophy-supporting-copy">
<p class="philosophy-brand-thesis"> <p class="philosophy-brand-thesis">
We don’t decorate for the holidays. We compose the season. We begin by noticing what makes a place itself.
</p> </p>
<p> <p>
Noel Design Atelier creates bespoke holiday installations that feel as though A sweeping staircase invites a different gesture from an intimate room. We take
they were always meant to belong. Every garland follows the architecture. Every our cues from those proportions, textures, and rhythms, letting the character of
ribbon serves a purpose. Every light contributes to atmosphere. the architecture guide what we bring to it.
</p> </p>
<p> <p>
The most memorable seasonal environments do not compete with the room. They As greenery and light find their place, familiar surroundings take on the warmth
complete it. True luxury is not louder. It is more thoughtful. of the holidays. Our hope is that entering the room feels both quietly new and
deeply familiar, like returning to somewhere you love.
</p> </p>
<a class="editorial-text-link" href="#approach"> <a class="editorial-text-link" href="#approach">
Our approach <span aria-hidden="true">→</span> A closer look <span aria-hidden="true">→</span>
</a> </a>
</div> </div>
</div> </div>
@@ -147,21 +149,23 @@
class="oversized-editorial-title approach-image-overlap-title image-overlap-heading-dynamic-inversion" class="oversized-editorial-title approach-image-overlap-title image-overlap-heading-dynamic-inversion"
id="approach-title" id="approach-title"
> >
Tradition. By hand.
</h2> </h2>
<div class="approach-content-grid"> <div class="approach-content-grid">
<div class="approach-supporting-copy"> <div class="approach-supporting-copy">
<p> <p>
Every element is rooted in craftsmanship, heritage, and the natural beauty of That sense of belonging takes shape in cedar, velvet, brass, and glass. We bring
the season. their textures together, finding the balance of softness and structure that
suits the room.
</p> </p>
<p> <p>
Fresh cedar, antique brass, hand-tied velvet, and glass catching candlelight are As a ribbon is tied and light catches an ornament, the arrangement begins to
chosen and placed with intention. settle. We work with those small relationships until each detail feels at ease
with the next.
</p> </p>
<a class="editorial-text-link" href="#work"> <a class="editorial-text-link" href="#work">
Explore our work <span aria-hidden="true">→</span> Imagine the season <span aria-hidden="true">→</span>
</a> </a>
</div> </div>
@@ -169,38 +173,38 @@
<div <div
class="photography-placeholder photography-placeholder-landscape" class="photography-placeholder photography-placeholder-landscape"
role="img" role="img"
aria-label="Artisan arranging ribbon, cedar, brass ornaments, and seasonal materials on a worktable" aria-label="Image placeholder: hands arranging ribbon, cedar, and brass ornaments on a worktable"
> >
<span>Artisan worktable with ribbon, cedar, and brass ornaments</span> <span>Ribbon, cedar, and brass coming together at the worktable</span>
</div> </div>
</figure> </figure>
</div> </div>
<div class="approach-principles-grid" aria-label="Noel Design Atelier brand principles"> <div class="approach-principles-grid" aria-label="How we compose a space">
<article class="approach-principle"> <article class="approach-principle">
<span class="approach-principle-index" aria-hidden="true">I.</span> <span class="approach-principle-index" aria-hidden="true">I.</span>
<h3>Curated</h3> <h3>Texture</h3>
<p> <p>
Every installation is intentionally composed. Nothing feels accidental. Nothing A branch’s uneven edge beside the smooth curve of glass gives the eye something
feels excessive. to explore. These contrasts bring depth and a little surprise to the composition.
</p> </p>
</article> </article>
<article class="approach-principle"> <article class="approach-principle">
<span class="approach-principle-index" aria-hidden="true">II.</span> <span class="approach-principle-index" aria-hidden="true">II.</span>
<h3>Crafted</h3> <h3>Gesture</h3>
<p> <p>
Natural materials. Artisan techniques. Meticulous execution. Luxury reveals A ribbon tied by hand follows its own soft curve. We leave room for that movement,
itself through detail. so the care of the maker remains in the finished piece.
</p> </p>
</article> </article>
<article class="approach-principle"> <article class="approach-principle">
<span class="approach-principle-index" aria-hidden="true">III.</span> <span class="approach-principle-index" aria-hidden="true">III.</span>
<h3>Remembered</h3> <h3>Atmosphere</h3>
<p> <p>
Decorations come down. The feeling remains. Great seasonal design becomes part Seen together, the details create a gentle rhythm across the room. A warm
of the space’s story. reflection leads the eye toward greenery, then leaves it somewhere quiet to rest.
</p> </p>
</article> </article>
</div> </div>
@@ -212,32 +216,32 @@
<header class="numbered-section-heading numbered-section-heading-on-dark"> <header class="numbered-section-heading numbered-section-heading-on-dark">
<span class="numbered-section-index" aria-hidden="true">03</span> <span class="numbered-section-index" aria-hidden="true">03</span>
<span class="numbered-section-rule" aria-hidden="true"></span> <span class="numbered-section-rule" aria-hidden="true"></span>
<p>Selected work</p> <p>Seasonal possibilities</p>
</header> </header>
<div class="work-heading-grid"> <div class="work-heading-grid">
<h2 class="oversized-editorial-title" id="work-title">Wonder.</h2> <h2 class="oversized-editorial-title" id="work-title">Gather.</h2>
<p class="work-introduction-copy"> <p class="work-introduction-copy">
Every installation tells the story of the season. Noel composes more than visual Imagine arriving out of the cold to a room lit for the holidays. There is something
beauty: environments that awaken emotion, inspire connection, and leave a lasting to catch your eye, somewhere to draw closer, and a reason to linger. These are a few
impression. of the moments we imagine as we compose a space.
</p> </p>
</div> </div>
<div class="work-gallery-grid" aria-label="Selected project image placeholders"> <div class="work-gallery-grid" aria-label="Imagined holiday settings, with image placeholders">
<figure class="work-gallery-primary-figure"> <figure class="work-gallery-primary-figure">
<div <div
class="photography-placeholder photography-placeholder-wide" class="photography-placeholder photography-placeholder-wide"
role="img" role="img"
aria-label="A monumental Christmas tree in a grand room illuminated with warm lights" aria-label="Image placeholder: a tall evergreen tree lit with warm lights in a grand room"
> >
<span>Monumental Christmas tree in a grand room</span> <span>A tall evergreen glowing in a welcoming room</span>
</div> </div>
<figcaption> <figcaption>
<span class="work-project-category">Luxury hospitality</span> <span class="work-project-category">On arrival</span>
<span class="work-project-description"> <span class="work-project-description">
A monumental focal point designed to stop guests in their tracks through A tree glowing at the end of a room offers a first glimpse of the celebration
beauty, not scale alone. within, inviting a guest to slow their step as they enter.
</span> </span>
</figcaption> </figcaption>
</figure> </figure>
@@ -246,15 +250,15 @@
<div <div
class="photography-placeholder photography-placeholder-portrait" class="photography-placeholder photography-placeholder-portrait"
role="img" role="img"
aria-label="A candlelit holiday table arranged for an intimate seasonal gathering" aria-label="Image placeholder: a holiday table set with greenery and candles for a small gathering"
> >
<span>Candlelit table composed for a seasonal gathering</span> <span>Greenery and candlelight around a holiday table</span>
</div> </div>
<figcaption> <figcaption>
<span class="work-project-category">Private estates</span> <span class="work-project-category">Around the table</span>
<span class="work-project-description"> <span class="work-project-description">
Warmth and gathering composed around the traditions a family returns to year A table framed by greenery leaves room for familiar faces and a conversation
after year. that carries on long after the last plate is cleared.
</span> </span>
</figcaption> </figcaption>
</figure> </figure>
@@ -263,15 +267,15 @@
<div <div
class="photography-placeholder photography-placeholder-square" class="photography-placeholder photography-placeholder-square"
role="img" role="img"
aria-label="Close detail of hand-tied velvet ribbon and an antique brass ornament" aria-label="Image placeholder: close view of velvet ribbon tied beside an antique brass ornament"
> >
<span>Velvet ribbon and antique brass detail</span> <span>The soft fold of velvet beside timeworn brass</span>
</div> </div>
<figcaption> <figcaption>
<span class="work-project-category">Material and detail</span> <span class="work-project-category">A closer look</span>
<span class="work-project-description"> <span class="work-project-description">
Hand-tied velvet, antique brass, and reflected light; luxury found in what In a fold of velvet or the patina of brass, there is another small discovery.
people almost miss. Such details reward a second glance as the evening unfolds.
</span> </span>
</figcaption> </figcaption>
</figure> </figure>
@@ -284,10 +288,11 @@
<div class="client-fit-content-grid"> <div class="client-fit-content-grid">
<div class="client-fit-heading-content"> <div class="client-fit-heading-content">
<p class="section-context-label section-context-label-brass">Who we design for</p> <p class="section-context-label section-context-label-brass">Who we design for</p>
<h2 class="client-fit-title" id="client-fit-title">Designed for remarkable places.</h2> <h2 class="client-fit-title" id="client-fit-title">Your kind of welcome.</h2>
<p class="client-fit-positioning-copy"> <p class="client-fit-positioning-copy">
Noel Design Atelier exists where luxury hospitality, timeless craftsmanship, Whether you are welcoming guests for a night or bringing family home for the
and seasonal storytelling become one experience. season, your space holds its own rituals. We shape our installations around that
life, giving the occasion a setting that feels like yours.
</p> </p>
<a class="editorial-text-link editorial-text-link-light" href="#contact"> <a class="editorial-text-link editorial-text-link-light" href="#contact">
Start a conversation <span aria-hidden="true">→</span> Start a conversation <span aria-hidden="true">→</span>
@@ -298,41 +303,43 @@
<div <div
class="photography-placeholder photography-placeholder-landscape" class="photography-placeholder photography-placeholder-landscape"
role="img" role="img"
aria-label="Grand doorway framed with fresh cedar and warm lights" aria-label="Image placeholder: an open doorway framed by cedar garland and warm lights"
> >
<span>Grand doorway framed with fresh cedar and warm light</span> <span>An open doorway edged with cedar and light</span>
</div> </div>
</figure> </figure>
</div> </div>
<div class="client-fit-category-grid" aria-label="Client and environment categories"> <div class="client-fit-category-grid" aria-label="Places and people we design for">
<article class="client-fit-category"> <article class="client-fit-category">
<h3>Luxury hospitality</h3> <h3>Luxury hospitality</h3>
<p> <p>
Hotels, destination properties, and gathering spaces shaped by arrival and A guest’s first evening away can begin with a sense of welcome. In hotels and
atmosphere. destination properties, we bring the season into the spaces people share.
</p> </p>
</article> </article>
<article class="client-fit-category"> <article class="client-fit-category">
<h3>Automotive and flagship retail</h3> <h3>Automotive and flagship retail</h3>
<p> <p>
Branded environments where seasonal design must complement identity and In showrooms and flagship stores, the holidays become another expression of your
architecture. world. We carry its character into the details that welcome visitors through the door.
</p> </p>
</article> </article>
<article class="client-fit-category"> <article class="client-fit-category">
<h3>Private estates</h3> <h3>Private estates</h3>
<p> <p>
Personal compositions created for family traditions, celebration, and memory. At home, the season gathers around familiar rituals. We make space for the
traditions you return to, and for the new memories taking shape around them.
</p> </p>
</article> </article>
<article class="client-fit-category"> <article class="client-fit-category">
<h3>Select events</h3> <h3>Select events</h3>
<p> <p>
Seasonal settings designed to welcome, gather, and be remembered. When people come together for an occasion, the setting can help them feel part
of it. We create a seasonal welcome that carries through the gathering.
</p> </p>
</article> </article>
</div> </div>
@@ -342,22 +349,24 @@
<section class="editorial-section contact-section" id="contact" aria-labelledby="contact-title"> <section class="editorial-section contact-section" id="contact" aria-labelledby="contact-title">
<div class="site-width-boundary contact-content-grid"> <div class="site-width-boundary contact-content-grid">
<div class="contact-heading-content"> <div class="contact-heading-content">
<p class="section-context-label">Inquire</p> <p class="section-context-label">Let’s begin</p>
<h2 class="contact-title" id="contact-title">Let’s compose your season.</h2> <h2 class="contact-title" id="contact-title">Tell us your story.</h2>
<p> <p>
Tell us about the property, the people who will experience it, and the feeling Perhaps you have a place in mind, a tradition you want to carry forward, or simply
you want them to remember. a feeling you would love to create. Tell us a little about it. We would be glad to
explore what the season could become with you.
</p> </p>
</div> </div>
<form class="project-inquiry-form" action="#contact-confirmation" method="get"> <form class="project-inquiry-form" action="#contact-confirmation" method="get">
<p class="contact-form-disclosure" id="contact-form-disclosure"> <p class="contact-form-disclosure" id="contact-form-disclosure">
Concept preview only. No information entered here is transmitted or stored. This form is a preview. Anything you enter stays in this page and is not sent to
the atelier or saved by this website.
</p> </p>
<div class="project-inquiry-field-grid"> <div class="project-inquiry-field-grid">
<div class="project-inquiry-field-group"> <div class="project-inquiry-field-group">
<label for="inquiry-name">Name</label> <label for="inquiry-name">Your name</label>
<input id="inquiry-name" type="text" autocomplete="name" required> <input id="inquiry-name" type="text" autocomplete="name" required>
</div> </div>
@@ -368,21 +377,22 @@
</div> </div>
<div class="project-inquiry-field-group"> <div class="project-inquiry-field-group">
<label for="inquiry-organization">Property or organization</label> <label for="inquiry-organization">Your home, property, or organization</label>
<input id="inquiry-organization" type="text" autocomplete="organization" required> <input id="inquiry-organization" type="text" autocomplete="organization" required>
</div> </div>
<div class="project-inquiry-field-group"> <div class="project-inquiry-field-group">
<label for="inquiry-project-brief">Project brief</label> <label for="inquiry-project-brief">What do you have in mind?</label>
<textarea id="inquiry-project-brief" rows="5" required></textarea> <textarea id="inquiry-project-brief" rows="5" required></textarea>
</div> </div>
<button class="project-inquiry-submit-button" type="submit" aria-describedby="contact-form-disclosure"> <button class="project-inquiry-submit-button" type="submit" aria-describedby="contact-form-disclosure">
Preview inquiry <span aria-hidden="true">→</span> Preview your inquiry <span aria-hidden="true">→</span>
</button> </button>
<p class="contact-form-confirmation" id="contact-confirmation" tabindex="-1"> <p class="contact-form-confirmation" id="contact-confirmation" tabindex="-1">
Your concept inquiry is ready. A live site would securely deliver it to the atelier. This is where a confirmation would appear. Your message has not been sent to the
atelier or saved by this website.
</p> </p>
</form> </form>
</div> </div>
@@ -407,13 +417,13 @@
decoding="async" decoding="async"
> >
</a> </a>
<p>Seasonal environments composed with intention.</p> <p>For the welcome you offer and the memories you make.</p>
</div> </div>
<nav class="website-footer-navigation" aria-label="Footer navigation"> <nav class="website-footer-navigation" aria-label="Footer navigation">
<p class="website-footer-column-title">Navigation</p> <p class="website-footer-column-title">Explore</p>
<ul> <ul>
<li><a href="#work">Work</a></li> <li><a href="#work">Season</a></li>
<li><a href="#philosophy">Philosophy</a></li> <li><a href="#philosophy">Philosophy</a></li>
<li><a href="#approach">Approach</a></li> <li><a href="#approach">Approach</a></li>
<li><a href="#contact">Contact</a></li> <li><a href="#contact">Contact</a></li>
@@ -422,7 +432,7 @@
<div class="website-footer-contact-column"> <div class="website-footer-contact-column">
<p class="website-footer-column-title">Pacific Northwest</p> <p class="website-footer-column-title">Pacific Northwest</p>
<p>For remarkable places and the people who gather there.</p> <p>We’d love to hear what you have in mind.</p>
<a class="editorial-text-link editorial-text-link-light" href="#contact"> <a class="editorial-text-link editorial-text-link-light" href="#contact">
Start a conversation <span aria-hidden="true">→</span> Start a conversation <span aria-hidden="true">→</span>
</a> </a>
+1 -1
View File
@@ -1206,7 +1206,7 @@ ul {
.primary-navigation-list { .primary-navigation-list {
justify-content: space-between; justify-content: space-between;
gap: 0.25rem 1rem; gap: 0.25rem 0.4rem;
} }
.primary-navigation-link { .primary-navigation-link {