:root { –rust: #C45B2A; –gold: #D4A017; –olive: #6B7C3A; –cream: #F5F0E8; –dark: #2A1F14; –mid: #6B5B4E; –light: #EDE8DF; }
@import url(‘
https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,900;1,400&family=Lora:ital,wght@0,400;0,500;1,400&family=DM+Mono:wght@400;500&display=swap’);
.ff-about { max-width: 780px; margin: 0 auto; padding: 80px 32px 100px; font-family: ‘Lora’, Georgia, serif; color: #2A1F14; background-color: #F5F0E8; }
.ff-header { text-align: center; margin-bottom: 64px; }
.ff-header__eyebrow { font-family: ‘DM Mono’, monospace; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: #C45B2A; margin-bottom: 18px; display: block; }
.ff-header__title { font-family: ‘Playfair Display’, Georgia, serif; font-size: clamp(46px, 8vw, 80px); font-weight: 900; line-height: 1; color: #2A1F14; letter-spacing: -0.02em; }
.ff-header__title span { color: #C45B2A; font-style: italic; }
.ff-ornament { display: flex; align-items: center; gap: 16px; margin: 32px auto; max-width: 300px; }
.ff-ornament__line { flex: 1; height: 1px; background: linear-gradient(to right, transparent, #D4A017); }
.ff-ornament__line–rev { background: linear-gradient(to left, transparent, #D4A017); }
.ff-ornament__icon { font-size: 18px; color: #D4A017; }
.ff-intro { font-size: 19px; line-height: 1.75; color: #2A1F14; margin-bottom: 36px; }
.ff-intro::first-letter { font-family: ‘Playfair Display’, serif; font-size: 72px; font-weight: 900; float: left; line-height: 0.75; margin: 8px 12px 0 0; color: #C45B2A; }
.ff-body p { font-size: 17px; line-height: 1.85; color: #6B5B4E; margin-bottom: 24px; }
.ff-pullquote { border-left: 4px solid #C45B2A; margin: 48px 0; padding: 24px 32px; background: #EDE8DF; border-radius: 0 8px 8px 0; position: relative; }
.ff-pullquote::before { content: ‘\201C’; font-family: ‘Playfair Display’, serif; font-size: 80px; color: #C45B2A; opacity: 0.2; position: absolute; top: -10px; left: 16px; line-height: 1; }
.ff-pullquote p { font-family: ‘Playfair Display’, serif; font-size: 20px !important; font-style: italic; color: #2A1F14 !important; line-height: 1.6 !important; margin: 0 !important; position: relative; z-index: 1; }
.ff-section-break { margin: 56px 0; display: flex; align-items: center; gap: 20px; }
.ff-section-break__line { flex: 1; height: 1px; background: #D4A017; opacity: 0.4; }
.ff-section-break__badge { font-family: ‘DM Mono’, monospace; font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: #6B7C3A; white-space: nowrap; padding: 6px 14px; border: 1px solid #6B7C3A; border-radius: 2px; opacity: 0.8; }
.ff-section-title { font-family: ‘Playfair Display’, serif; font-size: 32px; font-weight: 700; color: #2A1F14; margin-bottom: 24px; line-height: 1.2; }
.ff-section-title em { color: #C45B2A; font-style: italic; }
.ff-cta-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 56px; }
.ff-cta { display: block; padding: 28px 24px; text-decoration: none; border-radius: 4px; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.ff-cta:hover { transform: translateY(-2px); }
.ff-cta–primary { background: #C45B2A; box-shadow: 0 4px 24px rgba(196,91,42,0.3); }
.ff-cta–secondary { background: #2A1F14; box-shadow: 0 4px 20px rgba(42,31,20,0.2); }
.ff-cta__label { font-family: ‘DM Mono’, monospace; font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.6); display: block; margin-bottom: 6px; }
.ff-cta__text { font-family: ‘Playfair Display’, serif; font-size: 18px; font-weight: 700; color: #fff; display: block; line-height: 1.3; }
.ff-cta__arrow { display: inline-block; margin-top: 10px; font-size: 20px; color: rgba(255,255,255,0.5); }
.ff-footer-note { margin-top: 48px; text-align: center; }
.ff-footer-note p { font-family: ‘DM Mono’, monospace !important; font-size: 12px !important; letter-spacing: 0.1em; color: #D4A017 !important; opacity: 0.7; margin: 0 !important; }
@keyframes ff-fade-up { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
.ff-animate { opacity: 0; animation: ff-fade-up 0.7s ease forwards; }
.ff-animate:nth-child(1) { animation-delay: 0.1s; }
.ff-animate:nth-child(2) { animation-delay: 0.25s; }
.ff-animate:nth-child(3) { animation-delay: 0.4s; }
.ff-animate:nth-child(4) { animation-delay: 0.55s; }
.ff-animate:nth-child(5) { animation-delay: 0.7s; }
@media (max-width: 560px) { .ff-about { padding: 48px 20px 72px; } .ff-cta-row { grid-template-columns: 1fr; } }
Food has been my life since I was 16. Nearly 30 years as a professional chef, cooking in kitchens across the UK, Dubai, Holland, and America. Safe to say I know my way around a kitchen.
So you’d think meal planning at home would be easy, right?
My wife is vegetarian, and a couple of years ago she developed some health issues that meant dairy had to go too — which was gutting for her (we’re both big cheese people). Suddenly we had two very different diets to work around, and even with all my experience we still ended up in the same Sunday night conversation every week: “What shall we eat this week?” That low-grade argument that every household knows.
I thought — this really shouldn’t be this hard. So I built FlavourFrontier.
It removes the debate, handles the dietary complexity, and lets you plan your whole week in minutes instead of agonising over it. You still get variety, you still get to try new things, you just don’t have to think about it for an hour on a Sunday evening. That’s genuinely why it exists.
Going a step further
The boxes came out of wanting to do exactly that. After nearly three decades working with incredible ingredients from around the world, I wanted to bring some of that into people’s homes — the stuff that’s harder to get hold of, the ingredients that open up whole new styles of cooking.
Each Frontier Box is a curated selection of quality ingredients paired directly with the app, so you always have endless recipe ideas for what’s inside. It’s not just a hamper — it’s a whole cooking experience.
FlavourFrontier 