:root {
–yellow: #f6cb00;
–cream: #f7f1e7;
–paper: #fffdf8;
–black: #111111;
–charcoal: #292929;
–green: #687c5c;
–green-light: #dce4d4;
–orange: #ef6a3c;
–white: #ffffff;
–gray: #696969;
–shadow-small: 0 8px 20px rgba(0, 0, 0, 0.1);
–shadow-medium: 0 16px 36px rgba(0, 0, 0, 0.14);
–shadow-large: 0 24px 55px rgba(0, 0, 0, 0.18);
–site-width: 1240px;
}
* {
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
}
body {
margin: 0;
overflow-x: hidden;
background: var(–cream);
color: var(–black);
font-family: “Avenir Next”, Avenir, “Manrope”, Arial, sans-serif;
}
img {
display: block;
max-width: 100%;
}
a {
color: inherit;
}
button,
input,
textarea,
select {
font: inherit;
}
/* Makes sections escape WordPress’s narrow content column */
.emma-full-width {
position: relative;
left: 50%;
width: min(var(–site-width), calc(100vw – 40px));
max-width: none;
margin-left: 0;
transform: translateX(-50%);
}
.emma-container {
width: min(var(–site-width), calc(100% – 40px));
margin-inline: auto;
}
.emma-section {
padding: 105px 0;
scroll-margin-top: 110px;
}
.section-label {
display: inline-flex;
align-items: center;
gap: 10px;
margin: 0 0 18px;
color: var(–green);
font-size: 0.8rem;
font-weight: 800;
letter-spacing: 0.13em;
text-transform: uppercase;
}
.section-label::before {
content: “”;
width: 34px;
height: 3px;
background: var(–green);
transform: rotate(-4deg);
}
.section-title {
max-width: 900px;
margin: 0;
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: clamp(3.2rem, 6vw, 6.6rem);
font-weight: 900;
line-height: 0.96;
letter-spacing: -0.025em;
text-transform: uppercase;
}
.section-intro {
max-width: 680px;
margin: 24px 0 0;
color: var(–charcoal);
font-size: 1.05rem;
line-height: 1.75;
}
.emma-button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 14px;
min-height: 52px;
padding: 12px 24px;
border: 2px solid var(–black);
background: var(–yellow);
color: var(–black);
font-weight: 800;
text-decoration: none;
text-transform: uppercase;
box-shadow: 5px 6px 0 var(–black);
transition:
transform 0.2s ease,
box-shadow 0.2s ease;
}
.emma-button:hover,
.emma-button:focus-visible {
transform: translate(4px, 4px);
box-shadow: 1px 2px 0 var(–black);
}
.emma-button-dark {
background: var(–black);
color: var(–white);
}
.emma-button-light {
background: var(–paper);
}
.emma-button-small {
min-height: 46px;
padding: 10px 18px;
font-size: 0.86rem;
}
/* Navigation */
.emma-header {
position: relative;
z-index: 100;
margin-top: 18px;
margin-bottom: 24px;
}
.emma-header-inner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 22px;
width: 100%;
padding: 12px 16px;
border: 2px solid var(–black);
border-radius: 17px;
background: rgba(255, 253, 248, 0.96);
box-shadow: var(–shadow-small);
}
.emma-brand {
display: inline-flex;
align-items: center;
gap: 12px;
color: var(–black);
text-decoration: none;
}
.emma-brand-mark {
display: grid;
place-items: center;
width: 43px;
height: 43px;
border: 2px solid var(–black);
background: var(–yellow);
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: 1.25rem;
box-shadow: 3px 3px 0 var(–black);
transform: rotate(-3deg);
}
.emma-brand-name {
display: block;
font-size: 0.98rem;
font-weight: 800;
line-height: 1.05;
}
.emma-brand-role {
display: block;
margin-top: 3px;
color: var(–green);
font-size: 0.64rem;
font-weight: 800;
letter-spacing: 0.08em;
text-transform: uppercase;
}
.emma-navigation {
display: flex;
align-items: center;
gap: 5px;
}
.emma-navigation a {
position: relative;
padding: 10px 13px;
color: var(–black);
font-size: 0.88rem;
font-weight: 700;
text-decoration: none;
}
.emma-navigation a::after {
content: “”;
position: absolute;
right: 12px;
bottom: 5px;
left: 12px;
height: 2px;
background: var(–orange);
transform: scaleX(0);
transform-origin: left;
transition: transform 0.22s ease;
}
.emma-navigation a:hover::after,
.emma-navigation a:focus-visible::after {
transform: scaleX(1);
}
.emma-menu-button {
display: none;
width: 44px;
height: 44px;
border: 2px solid var(–black);
background: var(–yellow);
cursor: pointer;
}
.emma-menu-button span {
display: block;
width: 22px;
height: 3px;
margin: 4px auto;
background: var(–black);
}
/* Expanded yellow hero */
.emma-hero {
position: relative;
min-height: 720px;
padding: 34px;
overflow: hidden;
border-radius: 24px;
background:
linear-gradient(
rgba(246, 203, 0, 0.9),
rgba(246, 203, 0, 0.9)
),
repeating-linear-gradient(
135deg,
rgba(255, 255, 255, 0.1) 0,
rgba(255, 255, 255, 0.1) 22px,
rgba(0, 0, 0, 0.025) 22px,
rgba(0, 0, 0, 0.025) 42px
);
box-shadow: var(–shadow-medium);
}
.emma-hero::before {
content: “”;
position: absolute;
inset: 0;
opacity: 0.32;
pointer-events: none;
background:
radial-gradient(
circle at 18% 24%,
rgba(255, 255, 255, 0.82),
transparent 23%
),
radial-gradient(
circle at 80% 65%,
rgba(255, 255, 255, 0.3),
transparent 30%
);
}
/* Expanded white inner panel */
.emma-hero-panel {
position: relative;
z-index: 2;
display: grid;
grid-template-columns: 1.04fr 0.96fr;
width: 100%;
min-height: 650px;
overflow: hidden;
border-radius: 28px;
background: var(–paper);
box-shadow: var(–shadow-large);
}
.emma-hero-panel::before {
content: “”;
position: absolute;
z-index: 8;
top: -8px;
right: 45%;
left: 0;
height: 31px;
background: var(–paper);
clip-path: polygon(
0 50%,
8% 21%,
17% 58%,
27% 31%,
38% 65%,
49% 34%,
60% 66%,
72% 30%,
83% 62%,
91% 35%,
100% 8%,
100% 100%,
0 100%
);
}
.emma-hero-copy {
position: relative;
z-index: 10;
align-self: center;
padding: 72px 25px 65px 68px;
}
.emma-hero-eyebrow {
margin: 0 0 18px;
color: var(–green);
font-size: 0.84rem;
font-weight: 800;
letter-spacing: 0.13em;
line-height: 1.5;
text-transform: uppercase;
}
.emma-hero-title {
max-width: 660px;
margin: 0;
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: clamp(4.3rem, 6.5vw, 7.7rem);
font-weight: 900;
line-height: 0.89;
letter-spacing: -0.025em;
text-transform: uppercase;
}
.emma-hero-title > span {
display: block;
}
.emma-highlight {
position: relative;
display: inline-block !important;
color: var(–orange);
}
.emma-highlight::after {
content: “”;
position: absolute;
top: -8px;
right: -18px;
bottom: -8px;
left: -16px;
border: 5px solid var(–orange);
border-radius: 50%;
transform: rotate(-4deg);
}
.emma-hero-description {
max-width: 560px;
margin: 28px 0 30px;
color: var(–charcoal);
font-size: 1.02rem;
line-height: 1.7;
}
.emma-hero-actions {
display: flex;
flex-wrap: wrap;
gap: 16px;
}
/* Hero artwork */
.emma-hero-art {
position: relative;
min-height: 650px;
isolation: isolate;
}
.emma-hero-yellow-blob {
position: absolute;
z-index: -2;
top: 13%;
right: 2%;
width: 82%;
height: 75%;
border-radius: 46% 54% 38% 62% / 50% 41% 59% 50%;
background: var(–yellow);
transform: rotate(-4deg);
}
.emma-hero-green-blob {
position: absolute;
z-index: -3;
top: 7%;
right: -8%;
width: 67%;
height: 79%;
border-radius: 58% 42% 58% 42%;
background: var(–green-light);
transform: rotate(8deg);
}
.emma-character {
position: absolute;
z-index: 5;
bottom: 0;
left: 1%;
width: 69%;
max-height: 98%;
object-fit: contain;
object-position: bottom;
filter:
drop-shadow(8px 11px 0 rgba(255, 255, 255, 0.9))
drop-shadow(13px 17px 0 rgba(0, 0, 0, 0.14));
animation: emma-character-enter 0.8s
cubic-bezier(0.2, 0.8, 0.25, 1) both;
}
.emma-hero-note {
position: absolute;
z-index: 7;
right: 5%;
bottom: 13%;
width: 185px;
padding: 22px 20px;
border: 2px solid var(–black);
background:
linear-gradient(
rgba(255, 255, 255, 0.88),
rgba(255, 255, 255, 0.88)
),
repeating-linear-gradient(
0deg,
transparent 0,
transparent 21px,
rgba(79, 105, 145, 0.2) 22px
);
box-shadow: 7px 8px 0 rgba(0, 0, 0, 0.15);
transform: rotate(4deg);
}
.emma-hero-note::before {
content: “”;
position: absolute;
top: -12px;
left: 52px;
width: 72px;
height: 22px;
background: rgba(214, 192, 150, 0.72);
transform: rotate(-3deg);
}
.emma-hero-note strong {
display: block;
margin-bottom: 12px;
font-size: 0.78rem;
letter-spacing: 0.1em;
text-transform: uppercase;
}
.emma-hero-note ul {
margin: 0;
padding: 0;
list-style: none;
font-size: 0.9rem;
line-height: 1.9;
}
.emma-hero-note li::before {
content: “✓”;
margin-right: 8px;
font-weight: 800;
}
.emma-hero-dots {
position: absolute;
top: 10%;
right: 8%;
width: 110px;
height: 90px;
background-image:
radial-gradient(var(–green) 2.5px, transparent 2.5px);
background-size: 20px 20px;
}
.emma-hero-spark,
.emma-hero-heart {
position: absolute;
z-index: 9;
animation: emma-float 3.4s ease-in-out infinite;
}
.emma-hero-spark {
top: 11%;
left: 7%;
font-size: 2.3rem;
}
.emma-hero-heart {
top: 28%;
right: 9%;
font-size: 3rem;
animation-delay: 0.4s;
}
/* Moving text */
.emma-marquee {
margin-top: 28px;
overflow: hidden;
border-top: 3px solid var(–black);
border-bottom: 3px solid var(–black);
background: var(–black);
color: var(–yellow);
}
.emma-marquee-track {
display: flex;
width: max-content;
animation: emma-marquee 24s linear infinite;
}
.emma-marquee-item {
padding: 17px 26px;
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: 1.6rem;
letter-spacing: 0.03em;
text-transform: uppercase;
white-space: nowrap;
}
.emma-marquee-item::after {
content: “★”;
margin-left: 26px;
color: var(–white);
}
/* About */
.emma-about {
background: var(–paper);
}
.emma-about-grid {
display: grid;
grid-template-columns: 0.9fr 1.1fr;
gap: 70px;
align-items: center;
}
.emma-about-visual {
position: relative;
min-height: 540px;
}
.emma-about-card {
position: absolute;
inset: 24px 58px 40px 18px;
overflow: hidden;
border: 3px solid var(–black);
border-radius: 22px;
background: var(–yellow);
box-shadow: 13px 15px 0 var(–black);
transform: rotate(-2deg);
}
.emma-about-card img {
width: 100%;
height: 100%;
object-fit: contain;
object-position: bottom;
}
.emma-about-sticker {
position: absolute;
z-index: 4;
right: 5px;
bottom: 4px;
display: grid;
place-items: center;
width: 150px;
height: 150px;
border: 3px solid var(–black);
border-radius: 50%;
background: var(–paper);
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: 1.55rem;
line-height: 1;
text-align: center;
text-transform: uppercase;
box-shadow: 7px 8px 0 var(–black);
transform: rotate(7deg);
}
.emma-about-copy p {
color: var(–charcoal);
font-size: 1.02rem;
line-height: 1.8;
}
.emma-about-points {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 14px;
margin: 30px 0;
}
.emma-about-point {
padding: 17px;
border: 2px solid var(–black);
background: var(–paper);
font-weight: 700;
box-shadow: 4px 5px 0 var(–black);
}
/* Services */
.emma-services {
background: var(–yellow);
}
.emma-services-heading {
display: flex;
align-items: end;
justify-content: space-between;
gap: 40px;
margin-bottom: 52px;
}
.emma-services-heading .section-intro {
max-width: 470px;
margin: 0;
}
.emma-services-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px;
}
.emma-service-card {
position: relative;
min-height: 340px;
overflow: hidden;
padding: 34px;
border: 3px solid var(–black);
border-radius: 20px;
background: var(–paper);
box-shadow: 8px 9px 0 var(–black);
transition:
transform 0.25s ease,
box-shadow 0.25s ease;
}
.emma-service-card:hover {
transform: translateY(-7px);
box-shadow: 12px 15px 0 var(–black);
}
.emma-service-number {
margin-bottom: 34px;
color: var(–orange);
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: 3rem;
}
.emma-service-card h3 {
margin: 0 0 16px;
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: clamp(2.2rem, 4vw, 3.7rem);
line-height: 1;
text-transform: uppercase;
}
.emma-service-card p {
color: var(–charcoal);
line-height: 1.7;
}
.emma-service-list {
margin: 23px 0 0;
padding: 0;
list-style: none;
}
.emma-service-list li {
margin: 9px 0;
font-weight: 700;
}
.emma-service-list li::before {
content: “→”;
margin-right: 9px;
color: var(–orange);
}
/* Portfolio */
.emma-portfolio {
background: var(–paper);
}
.emma-portfolio-grid {
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 22px;
margin-top: 48px;
}
.emma-project {
overflow: hidden;
border: 3px solid var(–black);
border-radius: 18px;
background: var(–paper);
box-shadow: 7px 8px 0 var(–black);
}
.emma-project:nth-child(1),
.emma-project:nth-child(4) {
grid-column: span 7;
}
.emma-project:nth-child(2),
.emma-project:nth-child(3) {
grid-column: span 5;
}
.emma-project-visual {
display: grid;
place-items: center;
min-height: 260px;
padding: 32px;
background: var(–yellow);
}
.emma-project:nth-child(2) .emma-project-visual {
background: var(–green-light);
}
.emma-project:nth-child(3) .emma-project-visual {
background: var(–black);
}
.emma-project:nth-child(4) .emma-project-visual {
background: var(–orange);
}
.emma-project-placeholder {
width: 78%;
padding: 45px 20px;
border: 3px solid var(–black);
background: rgba(255, 255, 255, 0.82);
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: clamp(2rem, 4vw, 4.4rem);
line-height: 0.95;
text-align: center;
text-transform: uppercase;
box-shadow: 8px 9px 0 var(–black);
transform: rotate(-3deg);
}
.emma-project-info {
padding: 25px;
}
.emma-project-category {
color: var(–green);
font-size: 0.74rem;
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
}
.emma-project-info h3 {
margin: 10px 0;
font-size: 1.35rem;
}
.emma-project-info p {
margin: 0;
color: var(–gray);
line-height: 1.6;
}
/* Process */
.emma-process {
background: var(–green-light);
}
.emma-process-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 22px;
margin-top: 50px;
}
.emma-process-card {
min-height: 300px;
padding: 29px;
border: 3px solid var(–black);
background: var(–paper);
box-shadow: 7px 8px 0 var(–black);
}
.emma-process-number {
display: grid;
place-items: center;
width: 60px;
height: 60px;
margin-bottom: 32px;
border: 3px solid var(–black);
border-radius: 50%;
background: var(–yellow);
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: 1.9rem;
}
.emma-process-card h3 {
margin: 0 0 14px;
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: 2.1rem;
text-transform: uppercase;
}
.emma-process-card p {
color: var(–charcoal);
line-height: 1.7;
}
/* FAQ */
.emma-faq {
background: var(–paper);
}
.emma-faq-grid {
display: grid;
grid-template-columns: 0.75fr 1.25fr;
gap: 70px;
}
.emma-faq-list {
border-top: 3px solid var(–black);
}
.emma-faq-item {
border-bottom: 3px solid var(–black);
}
.emma-faq-question {
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
width: 100%;
padding: 23px 0;
border: 0;
background: transparent;
color: var(–black);
font-weight: 800;
text-align: left;
cursor: pointer;
}
.emma-faq-answer {
display: none;
padding: 0 40px 24px 0;
color: var(–charcoal);
line-height: 1.75;
}
.emma-faq-item.open .emma-faq-answer {
display: block;
}
.emma-faq-icon {
font-size: 1.7rem;
transition: transform 0.2s ease;
}
.emma-faq-item.open .emma-faq-icon {
transform: rotate(45deg);
}
/* Contact */
.emma-contact {
background: var(–black);
color: var(–white);
}
.emma-contact-grid {
display: grid;
grid-template-columns: 0.82fr 1.18fr;
gap: 70px;
}
.emma-contact .section-label {
color: var(–yellow);
}
.emma-contact .section-label::before {
background: var(–yellow);
}
.emma-contact .section-title {
color: var(–white);
}
.emma-contact-copy > p {
max-width: 520px;
color: #d7d7d7;
line-height: 1.8;
}
.emma-contact-form {
padding: 36px;
border: 3px solid var(–white);
background: var(–paper);
color: var(–black);
box-shadow: 10px 12px 0 var(–yellow);
}
.emma-form-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 18px;
}
.emma-form-field {
display: grid;
gap: 8px;
}
.emma-form-field-full {
grid-column: 1 / -1;
}
.emma-form-field label {
font-size: 0.86rem;
font-weight: 800;
}
.emma-form-field input,
.emma-form-field select,
.emma-form-field textarea {
width: 100%;
padding: 14px;
border: 2px solid var(–black);
border-radius: 0;
background: var(–white);
color: var(–black);
}
.emma-form-field textarea {
min-height: 140px;
resize: vertical;
}
.emma-form-field input:focus,
.emma-form-field select:focus,
.emma-form-field textarea:focus {
outline: 3px solid rgba(239, 106, 60, 0.25);
border-color: var(–orange);
}
/* Contact buttons and connected links */
.emma-contact-buttons {
display: flex;
flex-wrap: wrap;
gap: 16px;
margin-top: 28px;
}
.emma-contact-buttons .emma-button-light {
background: var(–paper);
color: var(–black);
}
.emma-footer-links a:hover,
.emma-footer-links a:focus-visible {
text-decoration: underline;
}
.emma-form-status {
margin: 16px 0 0;
color: var(–green);
font-weight: 800;
}
/* Footer */
.emma-footer {
padding: 44px 0;
border-top: 3px solid var(–black);
background: var(–yellow);
}
.emma-footer-grid {
display: grid;
grid-template-columns: 1.3fr 0.7fr 0.7fr;
gap: 40px;
}
.emma-footer h3 {
margin: 0 0 12px;
font-family: Impact, “Arial Narrow”, sans-serif;
font-size: 2.5rem;
text-transform: uppercase;
}
.emma-footer-links {
display: grid;
gap: 10px;
}
.emma-footer-links a {
font-weight: 700;
text-decoration: none;
}
.emma-footer-bottom {
display: flex;
justify-content: space-between;
gap: 20px;
margin-top: 38px;
padding-top: 20px;
border-top: 2px solid var(–black);
font-size: 0.85rem;
font-weight: 700;
}
/* Animations */
@keyframes emma-character-enter {
from {
opacity: 0;
transform: translateY(28px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes emma-float {
0%,
100% {
transform: translateY(0) rotate(-5deg);
}
50% {
transform: translateY(-8px) rotate(4deg);
}
}
@keyframes emma-marquee {
from {
transform: translateX(0);
}
to {
transform: translateX(-50%);
}
}
/* Tablet */
@media (max-width: 1000px) {
.emma-full-width {
width: calc(100vw – 28px);
}
.emma-navigation {
display: none;
position: absolute;
top: 74px;
right: 15px;
width: min(320px, calc(100vw – 40px));
padding: 14px;
border: 2px solid var(–black);
background: var(–paper);
box-shadow: var(–shadow-medium);
flex-direction: column;
align-items: stretch;
}
.emma-navigation.open {
display: flex;
}
.emma-menu-button {
display: block;
}
.emma-header-inner > .emma-button {
display: none;
}
.emma-hero {
min-height: auto;
padding: 24px;
}
.emma-hero-panel {
grid-template-columns: 1fr;
min-height: auto;
}
.emma-hero-copy {
padding: 65px 42px 22px;
}
.emma-hero-art {
min-height: 570px;
}
.emma-character {
left: 12%;
width: 58%;
}
.emma-about-grid,
.emma-faq-grid,
.emma-contact-grid {
grid-template-columns: 1fr;
}
.emma-services-heading {
display: block;
}
.emma-services-heading .section-intro {
margin-top: 22px;
}
.emma-process-grid {
grid-template-columns: repeat(2, 1fr);
}
.emma-footer-grid {
grid-template-columns: 1fr 1fr;
}
.emma-footer-grid > :first-child {
grid-column: 1 / -1;
}
}
/* Mobile */
@media (max-width: 700px) {
.emma-full-width {
width: calc(100vw – 16px);
}
.emma-container {
width: calc(100% – 24px);
}
.emma-section {
padding: 78px 0;
}
.emma-brand-role {
display: none;
}
.emma-hero {
padding: 10px;
border-radius: 18px;
}
.emma-hero-panel {
border-radius: 18px;
}
.emma-hero-copy {
padding: 52px 22px 18px;
}
.emma-hero-title {
font-size: clamp(3.35rem, 15vw, 5.1rem);
}
.emma-hero-actions {
flex-direction: column;
}
.emma-hero-actions .emma-button {
width: 100%;
}
.emma-hero-art {
min-height: 450px;
}
.emma-character {
left: -5%;
width: 76%;
}
.emma-hero-note {
right: 3%;
bottom: 8%;
width: 152px;
padding: 17px;
}
.emma-hero-dots {
display: none;
}
.emma-about-visual {
min-height: 420px;
}
.emma-about-card {
inset: 10px 25px 35px 5px;
}
.emma-about-sticker {
width: 118px;
height: 118px;
font-size: 1.2rem;
}
.emma-about-points,
.emma-services-grid,
.emma-process-grid,
.emma-form-grid {
grid-template-columns: 1fr;
}
.emma-project:nth-child(n) {
grid-column: 1 / -1;
}
.emma-contact-form {
padding: 23px;
}
.emma-contact-buttons {
flex-direction: column;
}
.emma-contact-buttons .emma-button {
width: 100%;
}
.emma-footer-grid {
grid-template-columns: 1fr;
}
.emma-footer-grid > :first-child {
grid-column: auto;
}
.emma-footer-bottom {
flex-direction: column;
}
}
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
scroll-behavior: auto !important;
animation-duration: 0.001ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.001ms !important;
}
}
Social Media Creative Strategist + Manager
Helping brands
turn content
into
clients
I help small businesses and creative brands plan their
content, strengthen their online presence, and stay
organized behind the scenes.
★
♡
What I bring
Strategy
Content
Systems
Growth
Social Media Strategy
Creative Content
Brand Organization
Event Promotion
Creative Support
Social Media Strategy
Creative Content
Brand Organization
Event Promotion
Creative Support
About Emma
Creative thinker. Organized planner.
I combine social media strategy, visual design,
marketing, organization, and project support to help
brands bring their ideas to life.
My approach is personal and practical. I help
businesses create content that feels intentional,
consistent, and connected to what they want to
accomplish.
Strategy that makes sense
Content that feels like you
Organized creative systems
Reliable ongoing support
Explore My Services →
Services
Creative support built around your brand.
Choose focused support for one project or build an
ongoing creative partnership that keeps your business
visible, organized, and consistent.
01
Social Media Strategy
A practical content direction designed around your
business, audience, goals, and online presence.
Account review
Content pillars
Audience direction
Monthly content ideas
02
Social Media Management
Ongoing support that helps your brand stay active
without everything falling on you.
Content calendars
Caption writing
Post scheduling
Campaign organization
03
Content Creation
Branded visuals designed to communicate clearly and
catch attention.
Social graphics
Carousel posts
Event flyers
Promotional materials
04
Creative Business Support
Behind-the-scenes support for turning ideas into
organized systems and professional materials.
Client templates
Marketing organization
Event communication
Virtual assistance
Selected Work
Creative work with strategy behind it.
Replace these placeholders with your real social media
graphics, flyers, brand projects, and campaigns.
Social Media
Creative Content Campaign
Strategy, graphics, captions, and promotional
materials for an ongoing campaign.
Events
Event Marketing Package
Promotional graphics, reminders, event information,
and attendee communication.
Branding
Visual Brand Refresh
Updated colors, typography, templates, and visual
direction.
Strategy
Organized Content System
A repeatable planning system for stronger
consistency and easier content creation.
My Process
Creative work without the confusion.
You do not need to have every detail figured out before
reaching out. We will organize it together.
1
Connect
We discuss your business, current challenges, goals,
and the type of support you need.
2
Plan
I organize your ideas into a clear strategy, scope,
content direction, and timeline.
3
Create
I develop your content, graphics, systems, and
marketing materials.
4
Grow
We review the finished work and create a stronger
foundation for what comes next.
Frequently Asked Questions
A few things you may be wondering.
What types of businesses do you work with?
+
I work primarily with small businesses, local businesses,
personal brands, creative entrepreneurs, event-based
businesses, restaurants, wellness professionals, and growing
brands that need help with content, marketing, or organization.
Do you offer one-time projects?
+
Yes. One-time projects may include social media graphics,
carousel posts, promotional flyers, event marketing materials,
branded templates, content planning, website graphics, or
creative business organization.
Do you offer ongoing monthly support?
+
Yes, depending on availability and the type of support you need.
Monthly services may include social media planning, content
creation, caption writing, scheduling, campaign support, and
ongoing creative or administrative assistance.
What if I am not sure which service I need?
+
That is completely fine. You do not need to have everything
figured out before reaching out. Tell me what currently feels
overwhelming, inconsistent, or disorganized, and we can
determine the best place to start.
Can you work with my existing branding?
+
Yes. I can work within your current brand colors, fonts,
graphics, and visual identity. I can also help make your
existing branding feel more consistent across social media and
marketing materials.
Do you create content for events?
+
Yes. I can create event flyers, social posts, reminder graphics,
confirmation messages, Facebook event details, email
communication, and promotional content for events.
How does the project process work?
+
We begin by discussing your business, goals, timeline, and the
type of support you need. I then organize the project, create
the agreed-upon materials, send them for review, and complete
any included revisions before final delivery.
How long does a project take?
+
The timeline depends on the project size, number of
deliverables, revision needs, and current availability. You
will receive a clearer estimated timeline after I review your
inquiry.
const emmaMenuButton =
document.querySelector(“.emma-menu-button”);
const emmaNavigation =
document.querySelector(“.emma-navigation”);
if (emmaMenuButton && emmaNavigation) {
emmaMenuButton.addEventListener(“click”, function () {
const isOpen =
emmaMenuButton.getAttribute(“aria-expanded”) === “true”;
emmaMenuButton.setAttribute(
“aria-expanded”,
String(!isOpen)
);
emmaNavigation.classList.toggle(“open”, !isOpen);
});
emmaNavigation
.querySelectorAll(“a”)
.forEach(function (link) {
link.addEventListener(“click”, function () {
emmaNavigation.classList.remove(“open”);
emmaMenuButton.setAttribute(
“aria-expanded”,
“false”
);
});
});
}
document
.querySelectorAll(“.emma-faq-item”)
.forEach(function (item) {
const question =
item.querySelector(“.emma-faq-question”);
question.addEventListener(“click”, function () {
const willOpen = !item.classList.contains(“open”);
item.classList.toggle(“open”, willOpen);
question.setAttribute(“aria-expanded”, String(willOpen));
});
});
const emmaContactForm =
document.getElementById(“emma-contact-form”);
if (emmaContactForm) {
emmaContactForm.addEventListener(“submit”, function (event) {
event.preventDefault();
const name =
document.getElementById(“emma-name”).value.trim();
const email =
document.getElementById(“emma-email”).value.trim();
const business =
document.getElementById(“emma-business”).value.trim();
const service =
document.getElementById(“emma-service”).value;
const message =
document.getElementById(“emma-message”).value.trim();
const subject =
encodeURIComponent(
“New website inquiry from ” + (name || “a potential client”)
);
const body =
encodeURIComponent(
“Name: ” + name + “\n” +
“Email: ” + email + “\n” +
“Business: ” + (business || “Not provided”) + “\n” +
“Service: ” + service + “\n\n” +
“Project details:\n” + message
);
const mailtoUrl =
“mailto:emma.m.raver@gmail.com” +
“?subject=” + subject +
“&body=” + body;
const status =
document.getElementById(“emma-form-status”);
if (status) {
status.textContent =
“Your email app should open with your inquiry ready to send.”;
}
window.location.href = mailtoUrl;
});
}
emmamraverdesigns 