/* * Molly Flynn — News & Contact * * V2026.09.22 * Build: 1 * * Styles the comparatively compact News archive and Message in a Bottle contact page, including their page-specific hierarchy, spacing, surfaces, and responsive details. */ /* ---------- 22. News page ---------- */ /* * Keep the News archive structurally Tiny, but give it the same hierarchy, * spacing, and spectral restraint as the rest of the Molly Flynn site. * The active News navigation item scopes these rules to the News landing page. */ body:has(nav a.News[aria-current="page"]) main > h2:first-child { margin-bottom: 0.85rem; } body:has(nav a.News[aria-current="page"]) main > h2:first-child + p { max-width: 48rem; margin-top: 0; margin-bottom: 2.15rem; font-size: 1.05em; line-height: 1.65; } /* Support the current shortcode classes as well as ordinary article markup. */ body:has(nav a.News[aria-current="page"]) .mf-news-list, body:has(nav a.News[aria-current="page"]) .news-list { max-width: 48rem; } body:has(nav a.News[aria-current="page"]) .mf-news-list article, body:has(nav a.News[aria-current="page"]) .news-list article, body:has(nav a.News[aria-current="page"]) .mf-news-item { position: relative; margin: 0; padding: 0 0 2.3rem; } body:has(nav a.News[aria-current="page"]) .mf-news-list article + article, body:has(nav a.News[aria-current="page"]) .news-list article + article, body:has(nav a.News[aria-current="page"]) .mf-news-item + .mf-news-item { margin-top: 2.4rem; padding-top: 2.4rem; } body:has(nav a.News[aria-current="page"]) .mf-news-list article + article::before, body:has(nav a.News[aria-current="page"]) .news-list article + article::before, body:has(nav a.News[aria-current="page"]) .mf-news-item + .mf-news-item::before { content: ""; position: absolute; top: 0; left: 0; width: min(82%, 34rem); height: 1px; background: linear-gradient( to right, rgba(143, 220, 255, 0.58), rgba(185, 198, 243, 0.20) 62%, transparent ); } body:has(nav a.News[aria-current="page"]) .mf-news-date, body:has(nav a.News[aria-current="page"]) .news-date, body:has(nav a.News[aria-current="page"]) .mf-news-list time, body:has(nav a.News[aria-current="page"]) .news-list time { display: block; margin: 0 0 0.3rem; color: var(--mf-text-muted); font-size: 0.86rem; line-height: 1.45; opacity: 0.82; } body:has(nav a.News[aria-current="page"]) .mf-news-list h3, body:has(nav a.News[aria-current="page"]) .news-list h3, body:has(nav a.News[aria-current="page"]) .mf-news-item h3 { margin: 0 0 0.8rem; font-size: clamp(1.45rem, 3.2vw, 2rem); line-height: 1.16; } body:has(nav a.News[aria-current="page"]) .mf-news-list h3 a, body:has(nav a.News[aria-current="page"]) .news-list h3 a, body:has(nav a.News[aria-current="page"]) .mf-news-item h3 a { color: var(--mf-ghost-light); text-decoration-thickness: 0.07em; text-underline-offset: 0.13em; } body:has(nav a.News[aria-current="page"]) .mf-news-summary, body:has(nav a.News[aria-current="page"]) .news-summary, body:has(nav a.News[aria-current="page"]) .mf-news-item .p-summary { margin: 0.75rem 0 0; line-height: 1.62; } body:has(nav a.News[aria-current="page"]) .mf-news-read-more, body:has(nav a.News[aria-current="page"]) .news-read-more { margin: 1rem 0 0; } body:has(nav a.News[aria-current="page"]) .mf-news-list + .mf-newsletter, body:has(nav a.News[aria-current="page"]) .news-list + .mf-newsletter, body:has(nav a.News[aria-current="page"]) .mf-news-item:last-of-type + .mf-newsletter { margin-top: 3.5rem; } @media (max-width: 44rem) { body:has(nav a.News[aria-current="page"]) main > h2:first-child + p { margin-bottom: 1.8rem; } body:has(nav a.News[aria-current="page"]) .mf-news-list article, body:has(nav a.News[aria-current="page"]) .news-list article, body:has(nav a.News[aria-current="page"]) .mf-news-item { padding-bottom: 1.9rem; } body:has(nav a.News[aria-current="page"]) .mf-news-list article + article, body:has(nav a.News[aria-current="page"]) .news-list article + article, body:has(nav a.News[aria-current="page"]) .mf-news-item + .mf-news-item { margin-top: 2rem; padding-top: 2rem; } body:has(nav a.News[aria-current="page"]) .mf-news-list h3, body:has(nav a.News[aria-current="page"]) .news-list h3, body:has(nav a.News[aria-current="page"]) .mf-news-item h3 { font-size: clamp(1.4rem, 7vw, 1.75rem); line-height: 1.18; } body:has(nav a.News[aria-current="page"]) .mf-news-list + .mf-newsletter, body:has(nav a.News[aria-current="page"]) .news-list + .mf-newsletter, body:has(nav a.News[aria-current="page"]) .mf-news-item:last-of-type + .mf-newsletter { margin-top: 2.75rem; } } /* ---------- Contact page: Message in a Bottle ---------- */ .mf-contact { width: min(100%, 46rem); margin: 1.4rem auto 0; padding: 1.5rem 1.6rem 1.7rem; border: 1px solid rgba(185, 198, 243, 0.24); border-radius: 0.85rem; background: radial-gradient( ellipse at 50% 0%, rgba(200, 217, 230, 0.075) 0%, transparent 42% ), linear-gradient( 180deg, rgba(18, 40, 62, 0.58), rgba(7, 21, 38, 0.72) ); box-shadow: inset 0 0 1.5rem rgba(143, 220, 255, 0.025), 0 0.8rem 2rem rgba(0, 0, 0, 0.16); } .mf-contact-intro { max-width: 39rem; margin: 0 auto 1.25rem; color: var(--mf-text-muted); font-size: 1.04rem; line-height: 1.7; text-align: center; } .mf-contact-intro p { margin: 0; } .mf-contact-author { display: flex; justify-content: center; margin: 0 auto 1.35rem; } .mf-contact-author a { display: inline-block; line-height: 0; } .mf-contact-wordmark { display: block; width: min(100%, 19rem); height: auto; margin: 0 auto; } .mf-contact-author a:focus-visible { border-radius: 0.45rem; outline: 2px solid var(--mf-ghost-core); outline-offset: 0.35rem; } .mf-contact-form { width: 100%; margin: 0 auto; } .mf-contact-form iframe { display: block; width: 100% !important; max-width: 100% !important; margin: 0 auto; border: 0; } @media (max-width: 44rem) { .mf-contact { width: 100%; margin-top: 1.1rem; padding: 1.15rem 1rem 1.25rem; } .mf-contact-intro { margin-bottom: 1.05rem; font-size: 1rem; text-align: left; } .mf-contact-author { margin-bottom: 1.15rem; } .mf-contact-wordmark { width: min(100%, 16rem); } }