/* Blog styles. Built on the landing tokens in styles.css (navy + amber on warm stone). */
.post-hero { background: radial-gradient(700px 360px at 90% -20%, rgba(227,160,58,.28), transparent 62%), radial-gradient(600px 340px at -10% 120%, rgba(198,93,59,.2), transparent 60%), linear-gradient(180deg, #17233a, #1c2b49); color: #fff; padding: 44px 0 40px; }
.post-hero h1 { color: #fff; font-size: clamp(1.85rem, 6vw, 3rem); max-width: 22ch; }
.blog-hero h1 { max-width: 20ch; }
.post-hero .lede { color: #cfd3dc; }
.post-hero .eyebrow { color: var(--accent-2); }
.crumbs { display: flex; gap: .5rem; font-size: .9rem; margin-bottom: 1rem; color: #aab1c1; }
.crumbs a { color: #d8d4cb; text-decoration: none; } .crumbs a:hover { color: #fff; text-decoration: underline; }
.post-meta { color: #aab1c1; font-size: .92rem; margin: 0; }
.post-body { max-width: 820px; padding-top: 28px; padding-bottom: 56px; }
.toc { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md); padding: 14px 18px; margin-bottom: 28px; box-shadow: var(--shadow-1); }
.toc summary { font-weight: 720; cursor: pointer; }
.toc ol { margin: .6rem 0 0; padding-left: 1.2rem; columns: 2 240px; column-gap: 2rem; font-size: .96rem; }
.toc li { margin: .2rem 0; break-inside: avoid; }
.prose { font-size: 1.06rem; line-height: 1.7; }
.prose > p, .prose li { color: var(--ink-2); }
.prose h2 { margin: 2.2rem 0 .8rem; font-size: clamp(1.45rem, 4.4vw, 1.9rem); scroll-margin-top: 80px; }
.prose h3 { margin: 1.8rem 0 .5rem; font-size: 1.22rem; scroll-margin-top: 80px; }
.prose ul, .prose ol { padding-left: 1.3rem; margin: 0 0 1.2em; }
.prose li { margin: .35rem 0; }
.prose a { color: var(--accent); font-weight: 600; }
.prose .lede { font-size: 1.16rem; color: var(--ink); max-width: none; }
.prose .fine, .fine { font-size: .88rem; color: var(--muted); }
.callout { background: var(--accent-soft); border: 1px solid var(--accent-line); border-left: 5px solid var(--accent); border-radius: var(--radius-md); padding: 16px 18px; margin: 1.4rem 0; }
.callout p { margin: 0; color: var(--ink); }
.tbl-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 1rem 0 .6rem; border-radius: var(--radius-md); border: 1px solid var(--line); box-shadow: var(--shadow-1); }
.tbl { width: 100%; border-collapse: collapse; background: var(--surface); font-size: .95rem; }
.prose > .tbl { border: 1px solid var(--line); border-radius: var(--radius-md); overflow: hidden; margin: 1rem 0; }
.tbl caption { text-align: left; font-weight: 700; padding: 10px 14px 4px; color: var(--ink); }
.tbl th, .tbl td { text-align: left; padding: 10px 14px; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl thead th { background: var(--brand); color: var(--brand-ink); font-weight: 700; white-space: nowrap; }
.tbl tbody tr:nth-child(even) td { background: var(--surface-2); }
.tbl-wrap .tbl { min-width: 620px; }
.post-faq { margin-top: 2.4rem; }
.post-faq .faq { max-width: none; }
.cta-box { margin-top: 2.6rem; background: linear-gradient(180deg, #17233a, #1c2b49); background-image: radial-gradient(500px 240px at 50% 0, rgba(227,160,58,.3), transparent 65%), linear-gradient(180deg, #17233a, #1c2b49); color: #fff; border-radius: var(--radius); padding: 28px 22px; text-align: center; }
.cta-box h2 { color: #fff; margin-top: 0; }
.cta-box p { color: #cfd3dc; }
.cta-box .btn { margin: .3rem; }
.related { background: var(--bg-2); padding: 48px 0; }
.related h2 { margin-bottom: 1.2rem; }
.post-grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.post-grid.big { padding: 40px 0 60px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 22px; }
.post-card { display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; text-decoration: none; color: var(--ink); box-shadow: var(--shadow-1); transition: transform .18s, box-shadow .18s; }
.post-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-2); }
.post-card img { aspect-ratio: 1200/630; object-fit: cover; width: 100%; }
.post-card .eyebrow { margin: 16px 18px 4px; }
.post-card h2, .post-card h3 { margin: 0 18px 8px; font-size: 1.18rem; line-height: 1.25; }
.post-card p { margin: 0 18px 10px; color: var(--ink-2); font-size: .96rem; }
.post-card .post-meta { margin: auto 18px 16px; color: var(--muted); }
/* change order form */
.co-form { margin: 1.2rem 0; background: #fff; border: 2px solid var(--brand); border-radius: 12px; padding: 18px; font-size: .9rem; color: #111; }
.co-head { display: flex; flex-wrap: wrap; gap: 4px 12px; justify-content: space-between; align-items: baseline; border-bottom: 2px solid var(--brand); padding-bottom: 8px; margin-bottom: 10px; }
.co-head strong { font-size: 1.3rem; letter-spacing: .06em; margin-right: 1rem; color: var(--brand); }
.co-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.co-f { display: flex; flex-direction: column; margin: 6px 0; }
.co-f label { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #555; }
.co-f span { min-height: 26px; border-bottom: 1px solid #999; }
.co-f .co-checks { border: 0; padding-top: 4px; }
.co-tall span { min-height: 80px; background: repeating-linear-gradient(#fff 0 25px, #bbb 25px 26px); border: 0; }
.co-tbl { width: 100%; border-collapse: collapse; margin: 10px 0; }
.co-tbl th, .co-tbl td { border: 1px solid #999; padding: 5px 8px; text-align: left; }
.co-tbl td:last-child, .co-tbl th:last-child { width: 34%; }
.co-tbl th { background: #eef0f4; }
.co-total td { font-weight: 800; background: #fbf3e4; }
.co-note { font-size: .82rem; font-style: italic; margin: 8px 0; color: #333; }
.co-sign span { min-height: 40px; }
@media (max-width: 560px) { .co-grid { grid-template-columns: 1fr; } .toc ol { columns: 1; } }
@media print {
  body { background: #fff; }
  .site-header, footer, .post-hero, .toc, .related, .cta-box, .noprint, .post-faq, .skip { display: none !important; }
  .prose > *:not(.co-form) { display: none !important; }
  .co-form { display: block !important; border: 0; margin: 0; padding: 0; font-size: 11pt; }
  .post-body { padding: 0; }
}