/* The Press — blog styles (matches the site's inline design) */
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { overflow-x: hidden; max-width: 100%; }
:root { --brand: #7B2E3B; --brand-deep: #58202A; --dark: #1C1418; --white: #FFFFFF; --cream: #F7F2EA; --gray: #F3EEE8; --muted: #8A807C; --border: #E7E0D6; --gold: #C9A24B; }
body { font-family: 'Inter', sans-serif; background: var(--white); color: #25201F; line-height: 1.6; }
h1, h2, h3 { font-family: 'Playfair Display', serif; }
.skip-link { position: absolute; top: -100%; left: 0; background: var(--brand); color: #fff; padding: 12px 24px; font-weight: 600; z-index: 9999; text-decoration: none; }
.skip-link:focus { top: 0; }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }

nav { height: 70px; background: var(--cream); border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 100; overflow: visible; display: grid; grid-template-columns: 1fr auto 1fr; grid-template-rows: 70px; align-items: center; padding: 0 40px; column-gap: 1cm; }
.nav-logo { display: flex; justify-content: center; align-items: center; line-height: 0; }
.nav-logo img { height: 54px; width: auto; margin-top: 2px; }
.nav-left { display: flex; align-items: center; gap: 24px; list-style: none; justify-self: end; }
.nav-right-group { display: flex; align-items: center; gap: 24px; justify-self: start; }
.nav-right-links { display: flex; align-items: center; gap: 24px; list-style: none; }
.nav-left a, .nav-right-links a { font-size: 13px; font-weight: 500; color: #5A5048; text-decoration: none; letter-spacing: 0.02em; white-space: nowrap; transition: color 0.2s; }
.nav-left a:hover, .nav-right-links a:hover, .nav-left a[aria-current], .nav-right-links a[aria-current] { color: var(--brand); }
.nav-order { background: var(--brand); color: #fff; padding: 9px 20px; border-radius: 100px; font-size: 13px; font-weight: 500; text-decoration: none; white-space: nowrap; transition: opacity 0.2s; }
.nav-order:hover { opacity: 0.8; }
.nav-toggle { position: absolute; right: 24px; display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 8px; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--dark); border-radius: 2px; }
.mobile-menu { position: fixed; inset: 0; background: var(--dark); z-index: 200; display: flex; flex-direction: column; padding: 0 40px 60px; opacity: 0; visibility: hidden; transition: opacity 0.3s, visibility 0.3s; }
.mobile-menu.open { opacity: 1; visibility: visible; }
.mobile-header { height: 80px; display: flex; align-items: center; justify-content: space-between; }
.mobile-logo-text { font-family: 'Playfair Display', serif; font-size: 22px; font-weight: 700; letter-spacing: 0.04em; color: #fff; text-decoration: none; }
.mobile-close { background: none; border: none; color: rgba(255,255,255,0.5); font-size: 24px; cursor: pointer; padding: 8px; }
.mobile-links { list-style: none; flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 4px; }
.mobile-links li a { font-family: 'Playfair Display', serif; font-size: clamp(30px, 7vw, 46px); font-weight: 600; color: rgba(255,255,255,0.55); text-decoration: none; padding: 6px 0; }
.mobile-order { background: var(--brand); color: #fff; padding: 14px 32px; border-radius: 4px; font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; text-decoration: none; align-self: flex-start; }

.demo-banner { background: var(--brand); color: #fff; text-align: center; padding: 10px 20px; font-size: 12px; font-weight: 500; position: relative; z-index: 101; }
.demo-banner a { color: #fff; font-weight: 700; text-decoration: underline; }

/* BLOG HEADER (matches story-hero) */
.blog-hero { background: linear-gradient(160deg, #2A1E24 0%, #1C1418 70%); color: var(--cream); padding: 96px 60px 80px; text-align: center; }
.blog-hero .eyebrow { font-family: 'Inter', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: #E0B9C2; margin-bottom: 18px; }
.blog-hero h1 { font-size: clamp(40px, 6.5vw, 74px); font-weight: 800; line-height: 1.05; color: #fff; max-width: 800px; margin: 0 auto; }
.blog-hero p { font-size: 17px; color: rgba(247,242,234,0.72); line-height: 1.7; max-width: 560px; margin: 20px auto 0; }

/* POST LIST (stacked, scales at any width) */
.post-wrap { max-width: 760px; margin: 0 auto; padding: 72px 32px 96px; }
.post-grid { display: block; }
.post-card { display: block; padding: 40px 0; border-bottom: 1px solid var(--border); text-decoration: none; }
.post-card:last-child { border-bottom: none; }
.post-card .ptag { display: block; font-family: 'Inter', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--brand); margin-bottom: 12px; }
.post-card h2 { font-size: clamp(26px, 3.4vw, 33px); font-weight: 700; color: var(--dark); line-height: 1.14; margin-bottom: 14px; transition: color 0.2s; }
.post-card:hover h2 { color: var(--brand); }
.post-card p { font-size: 15px; color: #55504C; line-height: 1.75; margin-bottom: 16px; max-width: 640px; }
.post-card .read { font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--brand); }

/* ARTICLE */
.article-wrap { max-width: 720px; margin: 0 auto; padding: 80px 32px 96px; }
.article-body { font-size: 17px; color: #46413C; line-height: 1.9; }
.article-body p { margin-bottom: 20px; }
.article-body h2 { font-size: clamp(26px, 3.2vw, 38px); font-weight: 700; color: var(--dark); line-height: 1.14; margin: 46px 0 16px; }
.article-body strong { color: var(--dark); font-weight: 600; }
.article-body ul { margin: 0 0 20px 22px; }
.article-body li { margin-bottom: 10px; }
.pull { font-family: 'Playfair Display', serif; font-style: italic; font-size: clamp(22px, 2.8vw, 31px); font-weight: 500; color: var(--brand); line-height: 1.3; margin: 44px 0; padding-left: 24px; border-left: 4px solid var(--brand); }
.article-divider { border: none; border-top: 1px solid var(--border); margin: 44px 0; }
.article-back { display: inline-block; font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); text-decoration: none; }
.article-back:hover { color: var(--brand); }

/* FOOTER */
footer { background: var(--dark); padding: 48px 60px; text-align: center; }
.footer-name { font-family: 'Playfair Display', serif; font-size: 20px; font-weight: 600; letter-spacing: 0.04em; color: #fff; }
.footer-copy { font-size: 12px; color: rgba(247,242,234,0.35); margin-top: 12px; }
.footer-twotop { font-size: 11px; color: rgba(247,242,234,0.25); margin-top: 8px; }
.footer-twotop a { color: rgba(247,242,234,0.45); text-decoration: none; }

/* collapse full nav to hamburger before its many items overflow */
@media (max-width: 1080px) {
    nav { display: flex; justify-content: center; }
    .nav-left, .nav-right-group { display: none; }
    .nav-toggle { display: flex; }
}
@media (max-width: 600px) {
    .blog-hero { padding: 72px 24px 56px; }
    .post-wrap, .article-wrap { padding: 56px 22px 72px; }
}