.emma-home-blog-section { background: #fff8f7; }
.emma-blog-hero { position: relative; overflow: hidden; padding: 56px 0; background: #dff3fa; }
.emma-blog-hero::before { position: absolute; top: -120px; right: 3%; width: 300px; height: 300px; border: 42px solid rgba(255,211,61,.8); border-radius: 50%; content: ""; }
.emma-blog-hero__inner { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.emma-blog-hero__inner > div { max-width: 720px; }
.emma-blog-hero h1 { margin: 9px 0 10px; color: #332d39; font-family: "Zilla Slab", Georgia, serif; font-size: 45px; font-weight: 800; line-height: 1.05; letter-spacing: 0; }
.emma-blog-hero p { margin: 0; color: #5f6870; font-size: 14px; line-height: 1.55; }
.emma-blog-hero__icon { display: grid; flex: 0 0 120px; width: 120px; height: 120px; place-items: center; border: 10px solid #fff; border-radius: 50%; background: #6948bd; color: #fff; box-shadow: 0 18px 35px rgba(53,58,91,.14); transform: rotate(6deg); }
.emma-blog-hero__icon svg { width: 53px; height: 53px; }
.emma-blog-listing { min-height: 400px; padding: 58px 0 75px; background: #fbfafc; }
.emma-blog-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; }
.emma-blog-grid--home { grid-template-columns: repeat(3, minmax(0,1fr)); }
.emma-blog-card { display: flex; min-width: 0; overflow: hidden; flex-direction: column; border: 1px solid #e5dfe9; border-radius: 8px; background: #fff; transition: transform .2s, box-shadow .2s, border-color .2s; }
.emma-blog-card:hover { border-color: #d6cae8; box-shadow: 0 15px 30px rgba(62,43,94,.09); transform: translateY(-3px); }
.emma-blog-card__media { position: relative; display: block; aspect-ratio: 1.55 / 1; overflow: hidden; background: #f0eafb; }
.emma-blog-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s; }
.emma-blog-card:hover .emma-blog-card__media img { transform: scale(1.03); }
.emma-blog-card__media.is-placeholder { display: grid; place-items: center; background-color: #eee8fa; background-image: url("bg-emma.png"); background-position: center; background-size: cover; }
.emma-blog-card__media.is-placeholder::after { position: absolute; inset: 0; background: rgba(105,72,189,.25); content: ""; }
.emma-blog-card__media.is-placeholder span { position: relative; z-index: 1; display: grid; width: 92px; height: 92px; place-items: center; border: 6px solid #fff; border-radius: 50%; background: #ffd33d; color: #4d3296; font-size: 10px; font-weight: 900; text-align: center; transform: rotate(-5deg); }
.emma-blog-card__media.is-placeholder svg { width: 31px; height: 31px; margin-bottom: -13px; }
.emma-blog-card__body { display: flex; flex: 1; flex-direction: column; padding: 19px; }
.emma-blog-card__meta { display: flex; align-items: center; justify-content: space-between; gap: 14px; color: #938b99; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.emma-blog-card__meta span { color: #6948bd; }
.emma-blog-card h3 { margin: 9px 0 10px; color: #36303c; font-family: "Zilla Slab", Georgia, serif; font-size: 21px; font-weight: 800; line-height: 1.15; letter-spacing: 0; }
.emma-blog-card__body > p { margin: 0 0 17px; color: #716a77; font-size: 11px; line-height: 1.55; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.emma-blog-card__more { display: inline-flex; align-items: center; gap: 8px; width: fit-content; margin-top: auto; color: #6948bd; font-size: 10px; font-weight: 900; }
.emma-blog-card--featured { grid-column: span 2; display: grid; grid-template-columns: 1.15fr .85fr; }
.emma-blog-card--featured .emma-blog-card__media { height: 100%; min-height: 330px; aspect-ratio: auto; }
.emma-blog-card--featured .emma-blog-card__body { justify-content: center; padding: 32px; }
.emma-blog-card--featured h3 { font-size: 30px; }
.emma-blog-pagination { margin-top: 40px; }
.emma-blog-pagination ul { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0; padding: 0; list-style: none; }
.emma-blog-pagination a, .emma-blog-pagination span { display: grid; min-width: 39px; height: 39px; padding: 0 8px; place-items: center; border: 1px solid #ddd5e6; border-radius: 7px; background: #fff; color: #655d6d; font-size: 11px; font-weight: 900; }
.emma-blog-pagination .current { border-color: #6948bd; background: #6948bd; color: #fff; }
.emma-blog-empty { padding: 65px 25px; border: 1px solid #e3dce9; border-radius: 8px; background: #fff; text-align: center; }
.emma-blog-empty > span { color: #6948bd; font-size: 10px; font-weight: 900; text-transform: uppercase; }
.emma-blog-empty h2 { margin: 8px 0; font-family: "Zilla Slab", Georgia, serif; font-size: 30px; font-weight: 800; }
.emma-blog-empty p { margin: 0; color: #716a77; font-size: 12px; }

.emma-article { background: #fbfafc; }
.emma-article__header { padding: 43px 0 48px; background: #eee8fa; text-align: center; }
.emma-article__header .emma-home-container { max-width: 850px; }
.emma-article__back { display: block; width: fit-content; margin: 0 auto 26px; color: #6948bd; font-size: 10px; font-weight: 900; }
.emma-article__meta { display: flex; justify-content: center; gap: 15px; color: #81798a; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.emma-article__meta span { color: #6948bd; }
.emma-article__header h1 { margin: 12px 0 12px; color: #302a37; font-family: "Zilla Slab", Georgia, serif; font-size: 48px; font-weight: 800; line-height: 1.05; letter-spacing: 0; }
.emma-article__header p { max-width: 670px; margin: 0 auto; color: #6d6575; font-size: 14px; line-height: 1.6; }
.emma-article__image { max-width: 960px; margin-top: 35px; }
.emma-article__image img { width: 100%; max-height: 560px; border-radius: 8px; object-fit: cover; }
.emma-article__layout { display: grid; grid-template-columns: minmax(0,720px) 230px; justify-content: center; align-items: start; gap: 40px; padding-top: 42px; padding-bottom: 75px; }
.emma-article__content { padding: 31px 35px; border: 1px solid #e5dfe9; border-radius: 8px; background: #fff; color: #514a57; font-size: 14px; line-height: 1.8; }
.emma-article__content h2 { margin: 32px 0 10px; color: #302a37; font-family: "Zilla Slab", Georgia, serif; font-size: 26px; font-weight: 800; }
.emma-article__content h3 { margin: 25px 0 8px; color: #3d3744; font-size: 17px; font-weight: 900; }
.emma-article__content p { margin: 0 0 17px; }
.emma-article__content img { max-width: 100%; height: auto; border-radius: 7px; }
.emma-article__content a { color: #6948bd; font-weight: 800; text-decoration: underline; }
.emma-article__content ul, .emma-article__content ol { margin: 0 0 18px; padding-left: 20px; }
.emma-article__content ul { list-style: disc; }
.emma-article__content ol { list-style: decimal; }
.emma-article__aside { position: sticky; top: 20px; padding: 23px; border-radius: 8px; background: #ffd33d; }
.emma-article__aside > span { color: #725d00; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.emma-article__aside h2 { margin: 7px 0 8px; font-family: "Zilla Slab", Georgia, serif; font-size: 21px; font-weight: 800; line-height: 1.15; }
.emma-article__aside p { margin: 0 0 16px; color: #665b31; font-size: 11px; line-height: 1.5; }
.emma-article__aside a { display: inline-flex; min-height: 40px; align-items: center; padding: 0 13px; border-radius: 7px; background: #6948bd; color: #fff; font-size: 10px; font-weight: 900; }
@media (max-width: 900px) {
    .emma-blog-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .emma-blog-card--featured { grid-column: 1 / -1; }
    .emma-article__layout { grid-template-columns: minmax(0,1fr) 210px; gap: 24px; }
}
@media (max-width: 650px) {
    .emma-blog-hero { padding: 40px 0; }
    .emma-blog-hero h1 { font-size: 35px; }
    .emma-blog-hero__icon { display: none; }
    .emma-blog-listing { padding: 38px 0 55px; }
    .emma-blog-grid, .emma-blog-grid--home { grid-template-columns: 1fr; }
    .emma-blog-card--featured { display: flex; grid-column: auto; }
    .emma-blog-card--featured .emma-blog-card__media { min-height: 0; aspect-ratio: 1.55 / 1; }
    .emma-blog-card--featured .emma-blog-card__body { padding: 19px; }
    .emma-blog-card--featured h3 { font-size: 23px; }
    .emma-article__header { padding: 32px 0 38px; }
    .emma-article__header h1 { font-size: 35px; }
    .emma-article__layout { grid-template-columns: 1fr; padding-top: 25px; }
    .emma-article__content { padding: 23px 20px; }
    .emma-article__aside { position: static; }
}