<x-dc> <helmet> <link rel="stylesheet" href="../_ds/trh-furniture-design-system-7b7af6a9-5a44-4cd9-a7e1-794a5b0d3e6e/tokens/fonts.css"> <link rel="stylesheet" href="../_ds/trh-furniture-design-system-7b7af6a9-5a44-4cd9-a7e1-794a5b0d3e6e/tokens/colors.css"> <link rel="stylesheet" href="../_ds/trh-furniture-design-system-7b7af6a9-5a44-4cd9-a7e1-794a5b0d3e6e/tokens/typography.css"> <link rel="stylesheet" href="../_ds/trh-furniture-design-system-7b7af6a9-5a44-4cd9-a7e1-794a5b0d3e6e/tokens/spacing.css"> <link rel="stylesheet" href="../_ds/trh-furniture-design-system-7b7af6a9-5a44-4cd9-a7e1-794a5b0d3e6e/styles.css"> <script src="../_ds/trh-furniture-design-system-7b7af6a9-5a44-4cd9-a7e1-794a5b0d3e6e/_ds_bundle.js"></script> <script src="../image-slot.js"></script> <style> html{scroll-behavior:smooth} body{margin:0;background:#161311} a{color:#8A6F45;text-decoration:none} a:hover{color:#141210} @keyframes navMenuIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}} @keyframes navRowIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}} [data-screen-label="Mobile menu"]>*{flex-shrink:0} @media (max-width:980px){[data-m~="desk"]{display:none!important}[data-m~="mob"]{display:flex!important}} @media (max-width:760px){ [data-m~="stack"]{grid-template-columns:minmax(0,1fr)!important;row-gap:clamp(24px,7vw,40px)!important} [data-m~="nogap"]{row-gap:0!important} [data-m~="colm"]{flex-direction:column!important;align-items:flex-start!important;gap:6px!important} [data-m~="img-m"]{height:58vh!important;min-height:320px!important} [data-m~="m-imgbox"]{min-height:0!important;padding:8px 0 40px!important;display:block!important} [data-m~="m-img"]{position:relative!important;left:auto!important;top:auto!important;transform:none!important;margin:0 auto!important;width:84%!important;max-width:84%!important;display:block!important} [data-m~="dusk-img"]{width:100%!important;height:56%!important;object-position:30% 50%!important;-webkit-mask-image:linear-gradient(to bottom,#000 70%,transparent)!important;mask-image:linear-gradient(to bottom,#000 70%,transparent)!important} [data-m~="dusk-ov"]{background:linear-gradient(to bottom,rgba(19,17,22,0) 30%,rgba(19,17,22,.7) 56%,rgba(19,17,22,.92) 100%)!important} [data-m~="dusk-sp"]{min-height:44vh!important} [data-m~="stone-img"]{height:320px!important;width:auto!important;max-width:none!important;right:-12%!important;bottom:-60px!important} [data-m~="stone-sp"]{min-height:260px!important} [data-m~="span1"]{grid-column:auto!important} [style*="position: sticky"]{position:relative!important;top:auto!important} } </style> </helmet> <div style="min-height:100vh;background:var(--surface-sheet);font-family:var(--font-sans)"> <a href="#main" style="position:absolute;left:-9999px;top:12px;z-index:300;padding:12px 18px;background:#161311;color:#F4F1EC;font-size:11px;font-weight:500;letter-spacing:.22em" style-focus="left:12px;color:#F4F1EC">SKIP TO CONTENT</a> <div aria-hidden="true" style="position:fixed;inset:0;z-index:200;pointer-events:none;background-image:url(../assets/texture/grain.png);background-repeat:repeat;background-size:180px 180px;opacity:.12"></div> <svg style="display:none" aria-hidden="true"><symbol id="rohn-icon" viewBox="0 0 144 225"><path fill="currentColor" d="M90.45,144h24.55c16.01,0,29,12.99,29,29v52h-53.55v-81h0Z"></path><rect fill="currentColor" x="62.59" y="-33.11" width="45" height="111.21" transform="translate(62.59 107.59) rotate(-90)"></rect><rect fill="currentColor" x="41.44" y="68.44" width="54.6" height="78.52" transform="translate(-38.96 176.44) rotate(-90)"></rect><path fill="currentColor" d="M29,0h25v196c0,16.01-12.99,29-29,29H0V29C0,12.99,12.99,0,29,0Z"></path><path fill="currentColor" d="M93.57,0h50.43v106c0,16.01-12.99,29-29,29h-21.43c-1.72,0-3.12-1.4-3.12-3.12V3.12c0-1.72,1.4-3.12,3.12-3.12Z"></path></symbol></svg> <header ref="{{ headerRef }}" data-screen-label="Header" style="position:fixed;top:0;left:0;right:0;z-index:80;display:flex;align-items:center;justify-content:space-between;gap:32px;padding:18px clamp(20px,5vw,56px);background:transparent;border-bottom:1px solid transparent;transition:background .18s linear,border-color .18s linear"> <a href="/" aria-label="ROHN Studio home" style="display:flex;align-items:center;gap:13px"> <svg viewBox="0 0 144 225" style="width:15px;height:23px;color:var(--logo-accent,var(--trh-ivory));transition:color .18s linear"><use href="#rohn-icon"></use></svg> <span style="font-family:var(--font-mark);font-size:19px;line-height:1;letter-spacing:.06em;color:var(--trh-ivory)">ROHN</span> <span style="font-weight:500;font-size:10px;line-height:1;letter-spacing:.42em;color:var(--logo-accent,var(--trh-ivory));padding-top:3px;transition:color .18s linear">STUDIO</span> </a> <nav data-m="desk" style="display:flex;align-items:center;gap:32px"> <a href="/about/" style="font-size:11px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ivory)" style-hover="color:var(--trh-bronze)">ABOUT</a> <a href="/for-designers/" style="font-size:11px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-bronze)">FOR DESIGNERS</a> <div ref="{{ menuRef }}" style="position:relative;display:flex;align-items:center"> <a href="/#collections" style="display:flex;align-items:center;gap:7px;font-size:11px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ivory)" style-hover="color:var(--trh-bronze)">COLLECTIONS<span style="display:block;width:4px;height:4px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);margin-bottom:2px"></span></a> <sc-if value="{{ menuOpen }}" hint-placeholder-val="{{ false }}"> <div style="position:absolute;top:100%;left:50%;transform:translateX(-50%);padding-top:20px;z-index:90"> <div style="min-width:272px;background:rgba(22,19,17,.97);border:1px solid rgba(200,168,120,.3);overflow:hidden;animation:navMenuIn .34s cubic-bezier(.22,.68,.24,1) both;box-shadow:0 18px 44px rgba(13,11,10,.45)"> <sc-for list="{{ collections }}" as="col" hint-placeholder-count="6"> <a href="{{ col.href }}" style="display:flex;align-items:center;justify-content:space-between;gap:20px;padding:13px 22px;color:var(--trh-ivory);background-image:{{ col.rowBg }};background-size:cover;background-position:center;border-bottom:1px solid rgba(13,11,10,.5);text-shadow:0 1px 7px rgba(13,11,10,.9);transition:filter .35s ease;animation:navRowIn .34s cubic-bezier(.22,.68,.24,1) both;animation-delay:{{ col.delay }}" style-hover="background-image:{{ col.rowBgHover }};filter:brightness(1.16) saturate(1.06)"> <span style="font-size:11px;font-weight:500;letter-spacing:var(--track-label);line-height:1">{{ col.name }}</span> <span style="font-size:10px;font-weight:300;letter-spacing:.08em;line-height:1;color:rgba(244,241,236,.74)">{{ col.note }}</span> </a> </sc-for> <a href="/#collections" style="display:block;padding:13px 22px;font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-bronze)" style-hover="color:var(--trh-ivory)">ALL COLLECTIONS</a> </div> </div> </sc-if> </div> <a href="/blog/" style="font-size:11px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ivory)" style-hover="color:var(--trh-bronze)">BLOG</a> <a href="/checkout/" style="display:flex;align-items:center;gap:9px;font-size:11px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ivory)" style-hover="color:var(--trh-bronze)"><svg width="16" height="16" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><path d="M3.6 5.8h12.8l-1.1 9.7a1.7 1.7 0 0 1-1.7 1.5H6.4a1.7 1.7 0 0 1-1.7-1.5z"></path><path d="M7.3 8.2V5.6a2.7 2.7 0 0 1 5.4 0v2.6"></path></svg><span>CART</span><sc-if value="{{ hasCart }}" hint-placeholder-val="{{ false }}"><span style="min-width:19px;height:19px;padding:0 6px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--trh-bronze);color:#161311;font-size:10px;font-weight:600;letter-spacing:0">{{ cartCount }}</span></sc-if></a> <span style="width:1px;height:16px;background:rgba(244,241,236,.25)"></span> <div style="display:flex;align-items:center;gap:16px"> <a href="https://www.facebook.com/ROHN.Studio" target="_blank" rel="noopener" aria-label="Facebook" style="display:flex;color:rgba(244,241,236,.7)" style-hover="color:var(--trh-bronze)"><svg width="17" height="17" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><path d="M13.5 2.5h-2.6a3.4 3.4 0 0 0-3.4 3.4v2.6H5v3h2.5v6h3v-6h2.6l.4-3h-3V6.1c0-.6.4-1 1-1h2z"></path></svg></a> <a href="https://www.instagram.com/rohn.studio/" target="_blank" rel="noopener" aria-label="Instagram" style="display:flex;color:rgba(244,241,236,.7)" style-hover="color:var(--trh-bronze)"><svg width="17" height="17" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><rect x="2.8" y="2.8" width="14.4" height="14.4" rx="4"></rect><circle cx="10" cy="10" r="3.4"></circle><circle cx="14.6" cy="5.4" r="0.6" fill="currentColor" stroke="none"></circle></svg></a> <a href="https://www.youtube.com/@ROHN.Studio" target="_blank" rel="noopener" aria-label="YouTube" style="display:flex;color:rgba(244,241,236,.7)" style-hover="color:var(--trh-bronze)"><svg width="18" height="17" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><rect x="1.8" y="4.5" width="16.4" height="11" rx="2.6"></rect><path d="M8.4 7.6l4 2.4-4 2.4z" fill="currentColor" stroke="none"></path></svg></a> </div> </nav> <div data-m="mob" style="display:none;align-items:center;gap:4px;margin-right:-10px"> <a href="/checkout/" aria-label="Cart" style="display:flex;align-items:center;justify-content:center;gap:6px;min-width:44px;height:44px;padding:0 4px;background:transparent;border:0;cursor:pointer;color:var(--trh-ivory)"><svg width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><path d="M3.6 5.8h12.8l-1.1 9.7a1.7 1.7 0 0 1-1.7 1.5H6.4a1.7 1.7 0 0 1-1.7-1.5z"></path><path d="M7.3 8.2V5.6a2.7 2.7 0 0 1 5.4 0v2.6"></path></svg><sc-if value="{{ hasCart }}" hint-placeholder-val="{{ false }}"><span style="min-width:18px;height:18px;padding:0 5px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:var(--trh-bronze);color:#161311;font-size:10px;font-weight:600;letter-spacing:0">{{ cartCount }}</span></sc-if></a> <button type="button" onClick="{{ toggleMobileNav }}" aria-label="{{ menuLabel }}" style="width:44px;height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:0;background:transparent;border:0;cursor:pointer"> <span style="display:block;width:22px;height:1px;background:var(--trh-ivory);transition:transform .25s ease;transform:{{ burgerTop }}"></span> <span style="display:block;width:22px;height:1px;background:var(--trh-ivory);transition:transform .25s ease;transform:{{ burgerBot }}"></span> </button> </div> </header> <sc-if value="{{ mobileNavOpen }}" hint-placeholder-val="{{ false }}"> <div data-screen-label="Mobile menu" style="position:fixed;inset:0;z-index:79;background:#161311;padding:92px clamp(20px,5vw,56px) 40px;display:flex;flex-direction:column;overflow-y:auto"> <div style="padding:0 0 10px;font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-bronze)">COLLECTIONS</div> <div style="border:1px solid rgba(200,168,120,.3);overflow:hidden"> <sc-for list="{{ collections }}" as="col" hint-placeholder-count="6"> <a href="{{ col.href }}" onClick="{{ closeMobileNav }}" style="display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;padding:0 18px;color:var(--trh-ivory);background-image:{{ col.rowBg }};background-size:cover;background-position:center;border-bottom:1px solid rgba(13,11,10,.5);text-shadow:0 1px 7px rgba(13,11,10,.9);transition:filter .35s ease;animation:navRowIn .34s cubic-bezier(.22,.68,.24,1) both;animation-delay:{{ col.delay }}" style-active="background-image:{{ col.rowBgHover }};filter:brightness(1.16) saturate(1.06)"> <span style="font-size:12px;font-weight:500;letter-spacing:var(--track-label);line-height:1">{{ col.name }}</span> <span style="font-size:11px;font-weight:300;letter-spacing:.08em;line-height:1;color:rgba(244,241,236,.74)">{{ col.note }}</span> </a> </sc-for> </div> <a href="/#collections" onClick="{{ closeMobileNav }}" style="display:block;padding:14px 0 28px;font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-bronze)">ALL COLLECTIONS</a> <a href="/about/" onClick="{{ closeMobileNav }}" style="display:block;padding:18px 0;border-bottom:1px solid rgba(200,168,120,.2);font-size:12px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ivory);border-top:1px solid rgba(200,168,120,.2)">ABOUT</a> <a href="/for-designers/" onClick="{{ closeMobileNav }}" style="display:block;padding:18px 0;border-bottom:1px solid rgba(200,168,120,.2);font-size:12px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ivory)">FOR DESIGNERS</a> <a href="/blog/" onClick="{{ closeMobileNav }}" style="display:block;padding:18px 0;border-bottom:1px solid rgba(200,168,120,.2);font-size:12px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ivory)">BLOG</a> <div style="margin-top:28px;display:flex"><div style="display:flex;align-items:center;gap:24px"> <a href="https://www.facebook.com/ROHN.Studio" target="_blank" rel="noopener" aria-label="Facebook" style="display:flex;color:rgba(244,241,236,.7)" style-hover="color:var(--trh-bronze)"><svg width="17" height="17" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><path d="M13.5 2.5h-2.6a3.4 3.4 0 0 0-3.4 3.4v2.6H5v3h2.5v6h3v-6h2.6l.4-3h-3V6.1c0-.6.4-1 1-1h2z"></path></svg></a> <a href="https://www.instagram.com/rohn.studio/" target="_blank" rel="noopener" aria-label="Instagram" style="display:flex;color:rgba(244,241,236,.7)" style-hover="color:var(--trh-bronze)"><svg width="17" height="17" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><rect x="2.8" y="2.8" width="14.4" height="14.4" rx="4"></rect><circle cx="10" cy="10" r="3.4"></circle><circle cx="14.6" cy="5.4" r="0.6" fill="currentColor" stroke="none"></circle></svg></a> <a href="https://www.youtube.com/@ROHN.Studio" target="_blank" rel="noopener" aria-label="YouTube" style="display:flex;color:rgba(244,241,236,.7)" style-hover="color:var(--trh-bronze)"><svg width="18" height="17" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><rect x="1.8" y="4.5" width="16.4" height="11" rx="2.6"></rect><path d="M8.4 7.6l4 2.4-4 2.4z" fill="currentColor" stroke="none"></path></svg></a> </div></div> </div> </sc-if> <main id="main"> <section data-screen-label="Trade hero" style="position:relative;height:84vh;min-height:580px;overflow:hidden;background:#161311"> <div style="position:absolute;top:-48px;bottom:-48px;left:0;right:0"> <image-slot id="trade-hero" shape="rect" src="../assets/collection/Ember_Edge_trade-hero-web.webp" placeholder="Drop an installed-project photo" data-parallax="44" style="width:100%;height:100%"></image-slot> </div> <div style="position:absolute;inset:0;background:linear-gradient(to top, rgba(22,19,17,.92) 0%, rgba(22,19,17,.6) 34%, rgba(22,19,17,.28) 64%, rgba(22,19,17,.44) 100%);pointer-events:none"></div> <div style="position:absolute;left:56px;right:56px;bottom:64px;display:flex;flex-direction:column;gap:24px"> <div data-hero=""> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Eyebrow" on="dark" rules="{{ false }}" hint-size="auto,20px">TRADE PROGRAM · DESIGNERS, ARCHITECTS &amp; BUILDERS</x-import> </div> <h1 data-hero="" style="margin:0;font-family:var(--font-display);font-weight:600;font-size:clamp(46px,5.6vw,80px);line-height:1.06;color:var(--trh-ivory);max-width:940px;text-wrap:pretty">Your drawing, our bench</h1> <div data-hero="" style="font-weight:300;font-size:15px;line-height:1.75;color:rgba(244,241,236,.85);max-width:560px">We build to spec for interior designers who need one honest piece to anchor a room, and the paperwork, samples, and lead times to specify it with confidence.</div> <div data-hero="" style="display:flex;flex-wrap:wrap;gap:12px 16px;margin-top:10px"> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Button" variant="bronze" on-click="{{ tradeInquiry }}" hint-size="auto,46px">Open a trade account</x-import> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Button" variant="outline-dark" on-click="{{ requestSamples }}" hint-size="auto,46px">Request a sample box</x-import> </div> </div> </section> <section data-screen-label="Trade intro" style="padding:clamp(96px,13vh,160px) clamp(20px,5vw,56px);background:var(--surface-sheet)"> <div data-m="stack" style="max-width:1280px;margin:0 auto;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(40px,7vw,110px);align-items:start"> <div data-reveal="" style="display:flex;flex-direction:column;gap:22px;position:sticky;top:120px"> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Eyebrow" rules="{{ true }}" hint-size="auto,20px">WORKING WITH US</x-import> <div style="font-family:var(--font-display);font-style:italic;font-weight:500;font-size:19px;line-height:1.5;color:var(--trh-bronze-deep)">One maker on the phone.<br>One shop building it.<br>No middle desk.</div> </div> <div style="display:flex;flex-direction:column;gap:34px"> <p data-reveal="60" style="margin:0;font-family:var(--font-display);font-weight:500;font-size:clamp(26px,2.8vw,38px);line-height:1.42;color:var(--trh-ink);text-wrap:pretty">You are specifying a piece that has to survive the install, the client, and <span style="font-style:italic;color:var(--trh-bronze-deep)">twenty years of daily use</span>.</p> <p data-reveal="140" style="margin:0;font-weight:300;font-size:16px;line-height:1.85;color:var(--text-body);max-width:640px">Send us a sketch on a napkin or a full elevation set. Either works. We answer with material options, a shop drawing, a firm price, and a delivery week. Nothing is subcontracted; the person who quotes your piece is the person who builds it.</p> <p data-reveal="200" style="margin:0;font-weight:300;font-size:16px;line-height:1.85;color:var(--text-body);max-width:640px">If a collection piece is close but not right, we will change the dimensions, base, edge, or finish rather than talk you into the stock version.</p> <div data-reveal="260" style="display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--border-default);margin-top:14px"> <div style="background:var(--surface-sheet);padding:26px 24px 24px;display:flex;flex-direction:column;gap:9px"> <span style="font-family:var(--font-display);font-weight:600;font-size:clamp(26px,7vw,34px);line-height:1;white-space:nowrap;color:var(--trh-ink)">10<span style="font-size:20px">%</span></span> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-bronze-deep)">TRADE PRICING</span> </div> <div style="background:var(--surface-sheet);padding:26px 24px 24px;display:flex;flex-direction:column;gap:9px"> <span style="font-family:var(--font-display);font-weight:600;font-size:clamp(26px,7vw,34px);line-height:1;white-space:nowrap;color:var(--trh-ink)">10–12</span> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-bronze-deep)">WEEK LEAD TIME</span> </div> <div style="background:var(--surface-sheet);padding:26px 24px 24px;display:flex;flex-direction:column;gap:9px"> <span style="font-family:var(--font-display);font-weight:600;font-size:clamp(26px,7vw,34px);line-height:1;white-space:nowrap;color:var(--trh-ink)">24<span style="font-size:20px">h</span></span> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-bronze-deep)">QUOTE TURNAROUND</span> </div> </div> </div> </div> </section> <section data-screen-label="What the trade program includes" style="background:var(--surface-inset);border-top:1px solid var(--border-default);padding:clamp(88px,11vh,140px) clamp(20px,5vw,56px)"> <div style="max-width:1280px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:clamp(40px,7vw,110px);align-items:start"> <div data-reveal="" style="display:flex;flex-direction:column;gap:26px;position:sticky;top:120px"> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Eyebrow" rules="{{ false }}" hint-size="auto,20px">WHAT THE ACCOUNT INCLUDES</x-import> <div style="font-family:var(--font-display);font-weight:600;font-size:clamp(28px,3vw,40px);line-height:1.24;color:var(--trh-ink);text-wrap:pretty">Nothing to qualify for, nothing to climb</div> <div style="display:flex;align-items:flex-end;gap:18px;padding:28px 0;border-top:1px solid var(--border-default);border-bottom:1px solid var(--border-default)"> <span style="font-family:var(--font-display);font-weight:500;font-size:clamp(64px,7vw,96px);line-height:.9;color:var(--trh-bronze-deep)">{{ discLabel }}</span> <span style="font-size:11px;font-weight:500;letter-spacing:var(--track-label);line-height:1.7;color:var(--trh-ink);padding-bottom:6px">OFF LIST ON EVERY PIECE<br>AND COMMISSION, AT QUOTE</span> </div> <div style="font-weight:300;font-size:14px;line-height:1.75;color:var(--text-body);max-width:420px">Free to open, no annual volume, no minimum order. We ask for a business name and a professional email.</div> </div> <div style="display:flex;flex-direction:column"> <sc-for list="{{ perkRows }}" as="p" hint-placeholder-count="5"> <div data-m="stack" data-reveal="" style="display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:24px;padding:30px 0;border-top:1px solid var(--border-default)"> <span style="font-family:var(--font-display);font-weight:500;font-size:20px;line-height:1.3;color:var(--trh-ink)">{{ p.name }}</span> <span style="font-weight:300;font-size:14px;line-height:1.78;color:var(--text-body)">{{ p.body }}</span> </div> </sc-for> </div> </div> </section> <section data-screen-label="Commission process" style="background:var(--surface-dark);padding:clamp(96px,12vh,150px) clamp(20px,5vw,56px)"> <div style="max-width:1280px;margin:0 auto;display:flex;flex-direction:column;gap:64px"> <div data-reveal="" style="display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap"> <div style="display:flex;flex-direction:column;gap:20px;max-width:680px"> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Eyebrow" on="dark" rules="{{ false }}" hint-size="auto,20px">HOW A COMMISSION RUNS</x-import> <div style="font-family:var(--font-display);font-weight:600;font-size:clamp(28px,3vw,40px);line-height:1.28;color:var(--trh-ivory);text-wrap:pretty">Five steps, and you approve every one of them in writing</div> </div> </div> <div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:40px 28px"> <sc-for list="{{ steps }}" as="s" hint-placeholder-count="5"> <div data-reveal="" style="display:flex;flex-direction:column;gap:14px"> <span style="font-family:var(--font-display);font-style:italic;font-weight:500;font-size:clamp(22px,2vw,28px);line-height:1.2;color:var(--trh-bronze)">{{ s.whenLabel }}</span> <div style="position:relative;height:1px;background:rgba(200,168,120,.35);margin:6px 0 10px"> <span style="position:absolute;left:0;top:-4px;width:9px;height:9px;border-radius:50%;background:var(--trh-bronze)"></span> </div> <span style="font-size:11px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ivory)">{{ s.num }} · {{ s.title }}</span> <span style="font-weight:300;font-size:14px;line-height:1.78;color:var(--trh-smoke)">{{ s.body }}</span> </div> </sc-for> </div> </div> </section> <section data-screen-label="Materials and finishes" style="padding:clamp(96px,12vh,150px) clamp(20px,5vw,56px);background:var(--surface-sheet)"> <div data-m="stack" style="max-width:1280px;margin:0 auto;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,88px);align-items:center"> <div data-reveal="" style="display:flex;flex-direction:column;gap:24px"> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Eyebrow" rules="{{ true }}" hint-size="auto,20px">MATERIAL &amp; FINISH LIBRARY</x-import> <div style="font-family:var(--font-display);font-weight:600;font-size:clamp(26px,2.6vw,36px);line-height:1.3;color:var(--trh-ink);text-wrap:pretty">Specify from the six house finishes, or bring your own reference</div> <div style="font-weight:300;font-size:15px;line-height:1.82;color:var(--text-body);max-width:520px">Every finish below is available on any form we build. We will match a stain to a flooring sample, a cabinet door, or a photograph, and send you a brushed-out sample on the actual species before we cut.</div> <div style="display:flex;flex-direction:column;gap:11px;padding-top:6px"> <div style="display:flex;gap:14px;font-weight:300;font-size:14px;line-height:1.7;color:var(--text-body)"><span style="color:var(--trh-bronze-deep)">·</span><span>Species: black walnut, white oak, ash, cherry, salvaged pine</span></div> <div style="display:flex;gap:14px;font-weight:300;font-size:14px;line-height:1.7;color:var(--text-body)"><span style="color:var(--trh-bronze-deep)">·</span><span>Finishes: oiled finish, matte conversion varnish, Yakisugi char, ebonized</span></div> <div style="display:flex;gap:14px;font-weight:300;font-size:14px;line-height:1.7;color:var(--text-body)"><span style="color:var(--trh-bronze-deep)">·</span><span>Metal: blackened steel, natural or aged bronze, brushed brass</span></div> <div style="display:flex;gap:14px;font-weight:300;font-size:14px;line-height:1.7;color:var(--text-body)"><span style="color:var(--trh-bronze-deep)">·</span><span>Sample boxes: curated to the piece, $75–$180, complimentary set once your order is placed</span></div> </div> <div style="padding-top:10px"> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Button" variant="outline" on-click="{{ requestSamples }}" hint-size="auto,46px">Request a sample box · from $75</x-import> </div> </div> <div style="display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--border-default);border:1px solid var(--border-default)"> <div data-img="" style="background:var(--surface-sheet);display:flex;flex-direction:column"> <img src="../assets/texture/ember-strip-v2.webp" alt="Ember charred finish" style="width:100%;height:150px;object-fit:cover;display:block;background:#d8d4cc"> <div style="border-top:1px solid var(--border-default);padding:15px 16px 18px;display:flex;flex-direction:column;gap:6px"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ink)">EMBER</span> <span style="font-weight:300;font-size:12px;line-height:1.6;color:var(--text-body)">Yakisugi char, matte</span> </div> </div> <div data-img="" style="background:var(--surface-sheet);display:flex;flex-direction:column"> <img src="../assets/texture/sable-strip.webp" alt="Sable walnut finish" style="width:100%;height:150px;object-fit:cover;display:block;background:#d8d4cc"> <div style="border-top:1px solid var(--border-default);padding:15px 16px 18px;display:flex;flex-direction:column;gap:6px"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ink)">SABLE</span> <span style="font-weight:300;font-size:12px;line-height:1.6;color:var(--text-body)">Black walnut, oiled finish</span> </div> </div> <div data-img="" style="background:var(--surface-sheet);display:flex;flex-direction:column"> <img src="../assets/texture/dusk-strip.webp" alt="Dusk ebonized finish" style="width:100%;height:150px;object-fit:cover;display:block;background:#d8d4cc"> <div style="border-top:1px solid var(--border-default);padding:15px 16px 18px;display:flex;flex-direction:column;gap:6px"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ink)">DUSK</span> <span style="font-weight:300;font-size:12px;line-height:1.6;color:var(--text-body)">Ebonized oak, satin</span> </div> </div> <div data-img="" style="background:var(--surface-sheet);display:flex;flex-direction:column"> <img src="../assets/texture/dune-strip.webp" alt="Dune whitewashed white oak finish" style="width:100%;height:150px;object-fit:cover;display:block;background:#d8d4cc;filter:brightness(1.16) saturate(.62)"> <div style="border-top:1px solid var(--border-default);padding:15px 16px 18px;display:flex;flex-direction:column;gap:6px"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ink)">DUNE</span> <span style="font-weight:300;font-size:12px;line-height:1.6;color:var(--text-body)">White oak, whitewash</span> </div> </div> <div data-img="" style="background:var(--surface-sheet);display:flex;flex-direction:column"> <img src="../assets/texture/stone-strip.webp" alt="Stone pale finish" style="width:100%;height:150px;object-fit:cover;display:block;background:#d8d4cc"> <div style="border-top:1px solid var(--border-default);padding:15px 16px 18px;display:flex;flex-direction:column;gap:6px"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ink)">STONE</span> <span style="font-weight:300;font-size:12px;line-height:1.6;color:var(--text-body)">Ash, natural</span> </div> </div> <div data-img="" style="background:var(--surface-sheet);display:flex;flex-direction:column"> <img src="../assets/texture/cedar-strip-v2.webp" alt="Cedar green finish" style="width:100%;height:150px;object-fit:cover;display:block;background:#d8d4cc"> <div style="border-top:1px solid var(--border-default);padding:15px 16px 18px;display:flex;flex-direction:column;gap:6px"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ink)">CEDAR</span> <span style="font-weight:300;font-size:12px;line-height:1.6;color:var(--text-body)">Cedar, brushed and sealed</span> </div> </div> </div> </div> </section> <section data-screen-label="Specification details" style="background:var(--surface-inset);border-top:1px solid var(--border-default);border-bottom:1px solid var(--border-default);padding:clamp(88px,11vh,140px) clamp(20px,5vw,56px)"> <div data-m="stack" style="max-width:1280px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,88px);align-items:start"> <div data-reveal="" style="display:flex;flex-direction:column;gap:26px"> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Eyebrow" rules="{{ false }}" hint-size="auto,20px">WHAT TO SEND US</x-import> <div style="font-weight:300;font-size:15px;line-height:1.82;color:var(--text-body);max-width:480px">A quote needs four things. Anything else you have, mood boards, plan views, a photo of the room, helps, but is not required.</div> <div style="display:grid;grid-template-columns:1fr;gap:1px;background:var(--border-default);border-top:1px solid var(--border-default);border-bottom:1px solid var(--border-default)"> <sc-for list="{{ needs }}" as="n" hint-placeholder-count="4"> <div style="background:var(--surface-inset);padding:20px 4px;display:flex;align-items:baseline;gap:20px"> <span style="font-family:var(--font-display);font-weight:500;font-size:16px;color:var(--trh-bronze-deep);min-width:22px">{{ n.num }}</span> <span style="font-size:11px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-ink);min-width:150px">{{ n.title }}</span> <span style="font-weight:300;font-size:14px;line-height:1.7;color:var(--text-body)">{{ n.body }}</span> </div> </sc-for> </div> </div> <div data-reveal="120" style="display:flex;flex-direction:column;gap:26px"> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Eyebrow" rules="{{ false }}" hint-size="auto,20px">TERMS AT A GLANCE</x-import> <div style="border:1px solid var(--border-default);background:var(--surface-sheet)"> <sc-for list="{{ terms }}" as="t" hint-placeholder-count="6"> <div style="display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding:19px 24px;border-bottom:1px solid var(--border-subtle)"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--text-label)">{{ t.k }}</span> <span style="font-family:var(--font-display);font-size:17px;color:var(--trh-ink);text-align:right">{{ t.v }}</span> </div> </sc-for> <div style="padding:19px 24px;font-weight:300;font-size:13px;line-height:1.7;color:var(--text-body)">Full terms and payment details are sent with every trade quote.</div> </div> </div> </div> </section> <section id="trade-account" data-screen-label="Trade account form" style="padding:clamp(96px,12vh,150px) clamp(20px,5vw,56px);background:var(--surface-sheet);border-bottom:1px solid var(--border-default)"> <div data-m="stack" style="max-width:1280px;margin:0 auto;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(40px,7vw,100px);align-items:start"> <div data-reveal="" style="display:flex;flex-direction:column;gap:22px"> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Eyebrow" rules="{{ true }}" hint-size="auto,20px">OPEN A TRADE ACCOUNT</x-import> <div style="font-family:var(--font-display);font-weight:600;font-size:clamp(26px,2.6vw,36px);line-height:1.3;color:var(--trh-ink);text-wrap:pretty">Tell us who you are and what you are specifying</div> <div style="font-weight:300;font-size:15px;line-height:1.82;color:var(--text-body);max-width:440px">Five fields. A maker reads it, not a form queue. We answer within 24 hours with pricing, material options, and an honest lead time.</div> <div style="font-weight:300;font-size:13px;line-height:1.75;color:var(--text-body);max-width:440px;border-top:1px solid var(--border-default);padding-top:18px">Requesting a sample box? Tell us the piece and the finishes you are after. Boxes are curated per item, $75–$180, charged before the box ships, and a complimentary sample set follows once your order is placed.</div> </div> <sc-if value="{{ tradeOpen }}" hint-placeholder-val="{{ true }}"> <form name="trade" method="POST" action="/" data-netlify="true" netlify-honeypot="bot-field" data-m="stack" ref="{{ formRef }}" onSubmit="{{ submitTrade }}" data-reveal="120" style="display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 36px;border-top:1px solid var(--border-default)"> <input type="hidden" name="form-name" value="trade"> <label aria-hidden="true" style="display:none">Leave this empty <input name="bot-field" tabindex="-1" autocomplete="off"></label> <label style="display:flex;flex-direction:column;gap:9px;padding:22px 0 18px;border-bottom:1px solid var(--border-default)"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--text-label)">NAME</span> <input required="{{ true }}" name="name" type="text" placeholder="First and last" style="border:none;background:transparent;font-family:var(--font-sans);font-weight:300;font-size:15px;line-height:1.5;color:var(--trh-ink);outline:none;padding:0;width:100%"> </label> <label style="display:flex;flex-direction:column;gap:9px;padding:22px 0 18px;border-bottom:1px solid var(--border-default)"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--text-label)">EMAIL</span> <input required="{{ true }}" name="email" type="email" placeholder="studio@example.com" style="border:none;background:transparent;font-family:var(--font-sans);font-weight:300;font-size:15px;line-height:1.5;color:var(--trh-ink);outline:none;padding:0;width:100%"> </label> <label style="display:flex;flex-direction:column;gap:9px;padding:22px 0 18px;border-bottom:1px solid var(--border-default)"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--text-label)">BUSINESS NAME</span> <input name="business" type="text" placeholder="Studio or firm" style="border:none;background:transparent;font-family:var(--font-sans);font-weight:300;font-size:15px;line-height:1.5;color:var(--trh-ink);outline:none;padding:0;width:100%"> </label> <label style="display:flex;flex-direction:column;gap:9px;padding:22px 0 18px;border-bottom:1px solid var(--border-default)"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--text-label)">SOCIALS OR WEBSITE</span> <input name="website" type="text" placeholder="@handle or url" style="border:none;background:transparent;font-family:var(--font-sans);font-weight:300;font-size:15px;line-height:1.5;color:var(--trh-ink);outline:none;padding:0;width:100%"> </label> <label style="grid-column:1/-1;display:flex;flex-direction:column;gap:9px;padding:22px 0 18px;border-bottom:1px solid var(--border-default)"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--text-label)">ANTICIPATED ORDER VOLUME</span> <select name="volume" style="appearance:none;border:none;background:transparent;font-family:var(--font-sans);font-weight:300;font-size:15px;line-height:1.5;color:var(--trh-ink);outline:none;padding:0;width:100%;cursor:pointer"> <option value="One piece">One piece for a current project</option> <option value="2-5 pieces a year">Two to five pieces a year</option> <option value="6-12 pieces a year">Six to twelve pieces a year</option> <option value="12+ pieces a year">Twelve or more pieces a year</option> <option value="Not sure yet">Not sure yet</option> </select> </label> <label style="grid-column:1/-1;display:flex;flex-direction:column;gap:9px;padding:22px 0 18px;border-bottom:1px solid var(--border-default)"> <span style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--text-label)">WHAT YOU ARE LOOKING FOR</span> <textarea name="details" rows="3" placeholder="Piece, dimensions, finish direction, or the item you want a sample box for." style="border:none;background:transparent;font-family:var(--font-sans);font-weight:300;font-size:15px;line-height:1.7;color:var(--trh-ink);outline:none;padding:0;width:100%;resize:vertical"></textarea> </label> <div style="grid-column:1/-1;display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding-top:28px"> <button type="submit" disabled="{{ tradeSending }}" style="border:none;background:var(--trh-bronze);color:#161311;font-family:var(--font-sans);font-size:11px;font-weight:500;letter-spacing:var(--track-label);padding:16px 30px;cursor:pointer" style-hover="background:var(--trh-bronze-deep);color:var(--trh-ivory)">SEND IT OVER</button> <span style="font-weight:300;font-size:12px;line-height:1.6;color:var(--text-body)">No annual volume, no minimum order. Free to open.</span> </div> <sc-if value="{{ tradeError }}" hint-placeholder-val="{{ false }}"> <div role="alert" style="grid-column:1/-1;padding-top:18px;font-weight:300;font-size:13px;line-height:1.7;color:var(--trh-ink)">That did not go through. Try again, or call the workshop at <a href="tel:+18108879950" style="color:inherit;text-decoration:underline;text-decoration-color:var(--trh-bronze);text-underline-offset:3px;white-space:nowrap" style-hover="color:var(--trh-bronze-deep)">(810) 887-9950</a>.</div> </sc-if> </form> </sc-if> </div> </section> <section data-screen-label="Designer testimonial" style="padding:clamp(100px,13vh,160px) clamp(20px,5vw,56px);display:flex;justify-content:center;background:var(--surface-sheet)"> <div data-reveal="" style="max-width:820px;display:flex;flex-direction:column;align-items:center;gap:26px;text-align:center"> <div style="font-family:var(--font-display);font-style:italic;font-weight:500;font-size:clamp(24px,2.5vw,32px);line-height:1.52;color:var(--trh-ink);text-wrap:pretty">“I sent an elevation on a Tuesday and had a shop drawing and a price by Thursday. The table landed within a quarter inch of the drawing, and my client thinks I invented it.”</div> <div style="width:44px;height:1px;background:var(--trh-bronze)"></div> <div style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-bronze-deep)">INTERIOR DESIGNER · BIRMINGHAM, MI</div> </div> </section> <section data-screen-label="Trade CTA" style="background:var(--surface-dark);border-top:1px solid rgba(200,168,120,.25);padding:clamp(64px,14vw,110px) clamp(20px,5vw,56px);display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center"> <div data-reveal=""> <svg viewBox="0 0 144 225" style="width:26px;height:41px;color:var(--trh-bronze)"><use href="#rohn-icon"></use></svg> </div> <div data-reveal="80" style="font-family:var(--font-display);font-weight:600;font-size:clamp(34px,3.4vw,48px);line-height:1.2;color:var(--trh-ivory);max-width:680px;text-wrap:pretty">Have a room that needs one real piece?</div> <div data-reveal="160" style="font-weight:300;font-size:15px;line-height:1.7;color:var(--trh-smoke);max-width:540px">Send the drawing, the dimensions, or just the idea. We will tell you honestly whether we are the right shop for it.</div> <div data-reveal="240" style="display:flex;gap:16px;margin-top:12px;flex-wrap:wrap;justify-content:center"> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Button" variant="bronze" on-click="{{ tradeInquiry }}" hint-size="auto,46px">Open a trade account</x-import> <x-import component-from-global-scope="TRHFurnitureDesignSystem_7b7af6.Button" variant="outline-dark" on-click="{{ callShop }}" hint-size="auto,46px">(810) 887 9950</x-import> </div> <div data-reveal="300" style="margin-top:16px;font-size:11px;font-weight:300;letter-spacing:.08em;color:var(--trh-smoke)">Shop visits by appointment · 1101 Rickett Rd, Brighton, Michigan</div> </section> </main> <footer data-screen-label="Footer" style="background:var(--surface-dark);border-top:1px solid rgba(200,168,120,.25);padding:44px clamp(20px,5vw,56px) 48px"> <div style="display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap"> <div style="display:flex;align-items:center;gap:12px"> <svg viewBox="0 0 144 225" style="width:13px;height:20px;color:var(--trh-bronze)"><use href="#rohn-icon"></use></svg> <span style="font-family:var(--font-mark);font-size:16px;line-height:1;letter-spacing:.06em;color:var(--trh-ivory)">ROHN</span> <span style="font-weight:400;font-size:11px;letter-spacing:.3em;color:var(--trh-smoke)">STUDIO</span> </div> <nav style="display:flex;align-items:center;gap:14px 26px;flex-wrap:wrap"> <a href="/about/" style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-smoke)" style-hover="color:var(--trh-bronze)">ABOUT</a> <a href="/for-designers/" style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-bronze)">FOR DESIGNERS</a> <a href="/#collections" style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-smoke)" style-hover="color:var(--trh-bronze)">COLLECTIONS</a> <a href="/blog/" style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-smoke)" style-hover="color:var(--trh-bronze)">BLOG</a> <a href="/contact/" style="font-size:10px;font-weight:500;letter-spacing:var(--track-label);color:var(--trh-smoke)" style-hover="color:var(--trh-bronze)">CONTACT</a> </nav> <div style="display:flex;align-items:center;gap:18px"> <a href="https://www.facebook.com/ROHN.Studio" target="_blank" rel="noopener" aria-label="Facebook" style="display:flex;color:var(--trh-bronze)" style-hover="color:var(--trh-ivory)"><svg width="17" height="17" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><path d="M13.5 2.5h-2.6a3.4 3.4 0 0 0-3.4 3.4v2.6H5v3h2.5v6h3v-6h2.6l.4-3h-3V6.1c0-.6.4-1 1-1h2z"></path></svg></a> <a href="https://www.instagram.com/rohn.studio/" target="_blank" rel="noopener" aria-label="Instagram" style="display:flex;color:var(--trh-bronze)" style-hover="color:var(--trh-ivory)"><svg width="17" height="17" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><rect x="2.8" y="2.8" width="14.4" height="14.4" rx="4"></rect><circle cx="10" cy="10" r="3.4"></circle><circle cx="14.6" cy="5.4" r="0.6" fill="currentColor" stroke="none"></circle></svg></a> <a href="https://www.youtube.com/@ROHN.Studio" target="_blank" rel="noopener" aria-label="YouTube" style="display:flex;color:var(--trh-bronze)" style-hover="color:var(--trh-ivory)"><svg width="18" height="17" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.3"><rect x="1.8" y="4.5" width="16.4" height="11" rx="2.6"></rect><path d="M8.4 7.6l4 2.4-4 2.4z" fill="currentColor" stroke="none"></path></svg></a> </div> </div> <div style="margin-top:30px;display:flex;align-items:center;justify-content:space-between;gap:14px 28px;flex-wrap:wrap;font-size:11px;font-weight:300;letter-spacing:.08em;color:var(--trh-smoke)"> <div>© 2026 ROHN Studio · Based in Brighton, Michigan · <span style="font-family: var(--font-display); font-style: italic;">Where rustic meets modern design</span></div> <div style="display:flex;align-items:center;gap:8px;flex-wrap:wrap"> <span>Site design by</span> <a href="https://leveretdrive.com" target="_blank" rel="noopener" style="display:flex;align-items:center;gap:7px;color:var(--trh-smoke)" style-hover="color:var(--trh-bronze)"><img src="../assets/img/LD-Icon-white-web.webp" alt="" width="16" height="16" style="display:block;width:16px;height:16px">Leveret Drive</a> </div> </div> </footer> </div> </x-dc>