/* Square Space Field Notes. Editorial typography; no new animation or 3D system. */
.blog-page main { position:relative; z-index:3; }
.blog-page [hidden] { display:none !important; }
.blog-page :where(section,header,figure)[id] { scroll-margin-top:7rem; }
.blog-page .crumb { flex-wrap:wrap; row-gap:.5rem; margin-bottom:3rem; }
.blog-page :where(h1,h2) em { color:var(--bronze); font-style:italic; }
.blog-page .label { font-size:.65rem; letter-spacing:.18em; color:var(--sand); }
.blog-index-head,.blog-article-head { padding-top:clamp(8rem,15vh,12rem); }
.blog-index-intro { display:grid; grid-template-columns:1.25fr 1fr; gap:6vw; align-items:end; padding-bottom:4rem; }
.blog-index-intro h1 { font-size:clamp(3.5rem,7vw,7.7rem); letter-spacing:-.055em; line-height:1.02; margin-top:1.5rem; }
.blog-index-intro > div:last-child { max-width:48ch; padding-bottom:.5rem; }
.blog-index-intro > div,.blog-article-head { position:relative; isolation:isolate; }
.blog-index-intro > div::before,.blog-article-head::before { content:""; position:absolute; inset:-2rem 0; z-index:-1; pointer-events:none; background:rgba(17,15,13,.94); mask-image:linear-gradient(to right,transparent,#000 5%,#000 95%,transparent); }
.blog-index-intro .lead { margin-bottom:1rem; color:var(--paper); }
.blog-index-intro p:not(.lead) { color:var(--paper-2); font-size:.96rem; }
.blog-text-link { display:inline-flex; gap:1rem; align-items:center; border-bottom:1px solid var(--bronze); padding-bottom:.45rem; margin-top:1.6rem; font-size:.83rem; }
.blog-text-link span { color:var(--bronze); }
.blog-filter-bar { display:flex; flex-wrap:wrap; gap:1.1rem 2rem; align-items:center; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:1.2rem 0; }
.blog-filters { display:flex; flex-wrap:wrap; gap:.4rem 1.4rem; }
.blog-filters button { font-size:.8rem; min-height:44px; padding:.25rem .4rem; color:var(--sand); border-bottom:1px solid transparent; }
.blog-filters button[aria-pressed="true"] { color:var(--paper); border-color:var(--bronze); }
.blog-filters button:hover { color:var(--paper); }
.blog-result-count { font-size:.72rem; color:var(--sand); margin-left:auto; }
.blog-feature { display:grid; grid-template-columns:1.3fr 1fr; gap:5vw; align-items:center; padding:3rem 0; }
.blog-feature-image { display:block; overflow:hidden; }
.blog-feature img { width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; }
.blog-feature h2 { font-size:clamp(2rem,3.6vw,4rem); letter-spacing:-.035em; line-height:1.13; margin:1.2rem 0; max-width:16ch; }
.blog-feature p { color:var(--paper-2); max-width:45ch; font-size:.94rem; }
.blog-feature .blog-image-note { color:var(--sand); font-size:.68rem; margin-top:2rem; }
.blog-register { border-top:1px solid var(--line); }
.blog-entry { display:grid; grid-template-columns:3.5rem minmax(0,1fr) 2rem; gap:2.5rem; padding:2.5rem 0; border-bottom:1px solid var(--line); }
.blog-entry-no { color:var(--bronze); font-family:var(--label); font-size:.75rem; padding-top:.1rem; }
.blog-entry h2 { font-size:clamp(1.4rem,2.1vw,2.3rem); max-width:40ch; line-height:1.25; margin:.85rem 0; letter-spacing:-.025em; }
.blog-entry p { max-width:70ch; color:var(--paper-2); font-size:.93rem; }
.blog-entry-arrow { font-size:1.5rem; color:var(--bronze); min-height:44px; text-align:center; }
.blog-entry-locations,.blog-locations { display:flex; gap:.7rem 1.4rem; flex-wrap:wrap; margin-top:1.25rem; font-family:var(--label); font-size:.68rem; color:var(--sand); }
.blog-index-close { padding-block:clamp(4rem,9vw,9rem); }
.blog-index-close h2 { font-size:var(--fs-h2); margin:1.5rem 0; }
.blog-index-close p { max-width:50ch; color:var(--paper-2); margin-bottom:2rem; }
.blog-meta,.blog-byline { display:flex; flex-wrap:wrap; gap:1rem 2.5rem; color:var(--sand); font-size:.72rem; }
.blog-meta { font-family:var(--label); text-transform:uppercase; letter-spacing:.16em; color:var(--bronze); }
.blog-article-head h1 { font-size:clamp(2.35rem,4.4vw,5.2rem); line-height:1.12; letter-spacing:-.04em; max-width:26ch; margin:1.5rem 0 2rem; }
.blog-opening { max-width:70ch; font-size:clamp(1.05rem,1.35vw,1.3rem); line-height:1.75; color:var(--paper-2); }
.blog-byline { padding-top:1.75rem; }
.blog-byline a { color:var(--paper); }
.blog-locations a { border-bottom:1px solid var(--line); padding-block:.5rem; }
.blog-reading { display:grid; grid-template-columns:minmax(12rem,.55fr) minmax(0,1.5fr); gap:clamp(3rem,7vw,8rem); padding-top:4rem; padding-bottom:5rem; align-items:start; }
.blog-toc { position:sticky; top:7rem; }
.blog-toc nav { border-top:1px solid var(--bronze); padding-top:1.5rem; }
.blog-toc ol { list-style:none; margin-top:1.5rem; }
.blog-toc li { margin-bottom:.9rem; }
.blog-toc a { display:flex; gap:1rem; font-size:.78rem; line-height:1.65; color:var(--paper-2); }
.blog-toc a span { color:var(--bronze); font-size:.65rem; padding-top:.15rem; }
.blog-toc > p { font-size:.72rem; color:var(--sand); border-top:1px solid var(--line); margin-top:2rem; padding-top:1.4rem; }
.blog-prose { min-width:0; max-width:78ch; background:rgba(17,15,13,.9); }
.blog-prose > section { margin-bottom:3.5rem; border-top:1px solid var(--line); padding-top:2rem; }
.blog-section-no { display:block; color:var(--bronze); font-size:.65rem; font-family:var(--label); margin-bottom:1rem; }
.blog-prose h2 { font-size:clamp(1.6rem,2.4vw,2.5rem); line-height:1.22; letter-spacing:-.025em; margin-bottom:1.4rem; max-width:28ch; }
.blog-prose h3 { font-size:1.05rem; line-height:1.45; margin-bottom:.7rem; }
.blog-prose p { color:var(--paper-2); font-size:1rem; line-height:1.85; margin-bottom:1.25rem; }
.blog-prose p:last-child { margin-bottom:0; }
.blog-prose :where(p,li,figcaption) a { color:var(--paper); text-decoration:underline; text-decoration-color:var(--bronze); text-underline-offset:.25em; }
.blog-page a:hover { color:var(--bronze); }
.blog-prose :where(ul,ol) { padding-left:1.25rem; margin:1.5rem 0; }
.blog-prose ul { list-style:disc; }
.blog-prose li { color:var(--paper-2); font-size:.96rem; line-height:1.8; margin-bottom:.8rem; padding-left:.4rem; }
.blog-prose li::marker { color:var(--bronze); }
.blog-note { margin:2rem 0; border-left:1px solid var(--bronze); padding:1rem 0 1rem 1.5rem; }
.blog-note p { font-size:.9rem; }
.blog-note ol { margin-bottom:1rem; }
.blog-table-wrap { max-width:100%; overflow-x:auto; margin:2rem 0; }
.blog-table-wrap:focus-visible { outline:2px solid var(--bronze); outline-offset:4px; }
.blog-prose table { border-collapse:collapse; width:100%; min-width:29rem; text-align:left; font-size:.87rem; line-height:1.7; }
.blog-prose caption { text-align:left; color:var(--sand); font-size:.75rem; padding-bottom:1rem; }
.blog-prose th { font-weight:500; color:var(--paper); }
.blog-prose td { color:var(--paper-2); }
.blog-prose :where(th,td) { padding:1rem 1rem 1rem 0; vertical-align:top; border-bottom:1px solid var(--line); }
.blog-prose thead th { color:var(--bronze); }
.blog-prose tbody th { width:37%; }
.blog-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem; margin:2rem 0; }
.blog-pair > div { border-top:1px solid var(--bronze); padding-top:1.3rem; }
.blog-pair h3 { margin-top:1rem; }
.blog-pair p { font-size:.91rem; }
.blog-prose .blog-sequence { padding:0; list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; margin:2rem 0; }
.blog-prose .blog-sequence li { padding:1.2rem 0 0; border-top:1px solid var(--bronze); margin:0; }
.blog-sequence span { font-family:var(--label); font-size:.64rem; letter-spacing:.1em; color:var(--bronze); text-transform:uppercase; }
.blog-sequence h3 { margin:1rem 0 .5rem; }
.blog-sequence p { font-size:.88rem; }
.blog-prose .blog-sequence--stages { grid-template-columns:repeat(3,minmax(0,1fr)); }
.blog-sequence--stages h3 { font-size:2rem; }
.blog-project,.blog-diagram { margin:2rem 0; }
.blog-project img,.blog-diagram img { display:block; width:100%; height:auto; }
.blog-diagram img { max-width:640px; margin-inline:auto; }
.blog-project figcaption,.blog-diagram figcaption { font-size:.76rem; line-height:1.8; color:var(--sand); margin-top:.8rem; }
.blog-faq { border-bottom:1px solid var(--line); }
.blog-faq summary { list-style:none; display:flex; justify-content:space-between; align-items:center; gap:1rem; cursor:pointer; font-size:1rem; padding:1.25rem 0; }
.blog-faq summary::-webkit-details-marker { display:none; }
.blog-faq summary > span { color:var(--bronze); font-size:1.2rem; }
.blog-faq[open] summary > span { transform:rotate(45deg); }
.blog-faq p { padding-bottom:1.25rem; font-size:.93rem; }
.blog-faq summary:focus-visible { outline:2px solid var(--bronze); outline-offset:3px; }
.blog-references ul { list-style:none; padding:0; }
.blog-references li { padding:0; font-size:.85rem; }
.blog-references p { font-size:.82rem; color:var(--sand); }
.blog-conversion h2 { margin-top:1.2rem; }
.blog-conversion .btn { margin-top:1rem; }
.blog-related { border-top:1px solid var(--line); padding-top:2rem; }
.blog-related > a { display:block; font-size:1.1rem; line-height:1.5; border-bottom:1px solid var(--line); padding:1.5rem 0; }
.blog-related a > span:first-child { display:block; font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; color:var(--bronze); margin-bottom:.7rem; }
@media(max-width:1100px) {
 .blog-reading { grid-template-columns:13rem minmax(0,1fr); gap:2.5rem; }
 .blog-index-intro { gap:3rem; }
 .blog-filter-bar > .label { flex-basis:100%; }
}
@media(max-width:900px) {
 .blog-reading { grid-template-columns:minmax(0,1fr); gap:2.5rem; }
 .blog-toc { position:static; max-width:78ch; }
 .blog-toc ol { columns:2; column-gap:2rem; }
 .blog-toc li { break-inside:avoid; }
 .blog-toc > p { display:none; }
 .blog-index-intro { grid-template-columns:minmax(0,1fr); gap:2rem; }
 .blog-index-intro > div:last-child { max-width:60ch; }
 .blog-feature { gap:2.5rem; }
}
@media(max-width:600px) {
 .blog-index-head,.blog-article-head { padding-top:8rem; }
 .blog-page .crumb { margin-bottom:2rem; font-size:.6rem; }
 .blog-index-intro h1 { font-size:clamp(3.3rem,13vw,5rem); }
 .blog-index-intro { padding-bottom:2.5rem; }
 .blog-feature { grid-template-columns:minmax(0,1fr); gap:1.5rem; padding:2rem 0; }
 .blog-feature h2 { max-width:23ch; }
 .blog-result-count { flex-basis:100%; margin:0; }
 .blog-entry { grid-template-columns:1.6rem minmax(0,1fr) 1.4rem; gap:.8rem; padding:2rem 0; }
 .blog-entry .label { font-size:.58rem; }
 .blog-entry h2 { font-size:1.4rem; }
 .blog-entry p { font-size:.87rem; }
 .blog-entry-locations { font-size:.62rem; gap:.7rem; }
 .blog-meta { gap:.8rem; font-size:.62rem; }
 .blog-article-head h1 { font-size:clamp(2rem,7.5vw,2.8rem); }
 .blog-byline { gap:.8rem 1.5rem; }
 .blog-reading { padding-top:2.5rem; }
 .blog-toc ol { columns:auto; }
 .blog-prose h2 { font-size:1.7rem; }
 .blog-prose .blog-sequence,.blog-prose .blog-sequence--stages,.blog-pair { grid-template-columns:minmax(0,1fr); }
 .blog-prose p { font-size:.98rem; }
 .blog-conversion .btn { font-size:.62rem; padding-inline:1rem; max-width:100%; text-align:center; }
}
@media(prefers-reduced-motion:reduce) { .blog-page :where(h1,h2,h3,a) { transition:none; } }
@media print { .blog-toc,.blog-filters,.blog-conversion,.blog-related { display:none; } .blog-reading { display:block; } .blog-prose { max-width:none; background:none; } .blog-table-wrap { overflow:visible; } }