:root {
  color-scheme: light;
  --paper: oklch(.965 .004 95); --paper-raised: oklch(.985 .003 95); --ink: oklch(.17 .006 260);
  --ink-soft: oklch(.36 .008 255); --muted: oklch(.55 .012 255); --line: oklch(.78 .012 235);
  --line-light: oklch(.87 .008 235); --teal: oklch(.45 .12 210); --teal-light: oklch(.91 .035 207);
  --dark: oklch(.20 .012 253); --dark-ink: oklch(.91 .008 95);
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; --page: 1240px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--mono); font-size: 14px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--teal); }
button, input, textarea { font: inherit; }
::selection { color: var(--paper); background: var(--teal); }
.container { width: min(var(--page), calc(100% - 96px)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 20; left: 16px; top: 12px; padding: 10px 14px; transform: translateY(-160%); background: var(--ink); color: var(--paper); }
.skip-link:focus { transform: translateY(0); }
a:focus-visible { outline: 2px solid var(--teal); outline-offset: 5px; }
.site-header { height: 94px; border-bottom: 1px dashed var(--line); }
.header-inner { height: 100%; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.wordmark { display: inline-flex; align-items: center; gap: 12px; line-height: 1.2; }
.wordmark-mark { font-size: 22px; font-weight: 700; letter-spacing: -.13em; color: var(--teal); }
.wordmark-name { font-size: 10px; line-height: 1.35; letter-spacing: .03em; }
.site-nav { display: flex; align-items: center; gap: clamp(18px, 3.3vw, 48px); font-size: 11px; letter-spacing: .04em; }
.site-nav a { padding: 10px 0; color: var(--ink-soft); }
.site-nav a:hover, .site-nav a[aria-current="page"] { color: var(--teal); }
.site-nav a[aria-current="page"]::before { content: "+ "; color: var(--teal); }
.site-nav .nav-external { color: var(--muted); }
.eyebrow, .micro-label { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.5; letter-spacing: .12em; text-transform: uppercase; }
.status-dot { display: inline-block; width: 6px; height: 6px; margin: 0 8px 1px 0; border-radius: 50%; background: var(--teal); }
.status-dot-muted { background: oklch(.68 .025 75); }
.eyebrow-index { margin-left: 14px; color: var(--muted); }
.hero { position: relative; min-height: 638px; display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(390px, .97fr); align-items: center; gap: 7.5%; padding-top: 66px; padding-bottom: 82px; }
.hero-copy { max-width: 590px; padding-bottom: 20px; }
h1, h2, h3, p { margin-top: 0; }
.hero h1 { margin: 30px 0 22px; font-size: clamp(48px, 6.05vw, 82px); font-weight: 400; line-height: .99; letter-spacing: -.085em; }
.accent, .heading-period { color: var(--teal); }
.hero-lede { max-width: 490px; margin-bottom: 30px; color: var(--ink-soft); font-size: 14px; line-height: 1.9; }
.text-link { display: inline-flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--teal); padding-bottom: 4px; color: var(--teal); font-size: 11px; letter-spacing: .02em; }
.text-link:hover { color: var(--ink); border-color: var(--ink); }
.arrow-link { gap: 15px; }
.hero-preview-wrap { width: min(100%, 450px); justify-self: end; margin-top: 10px; }
.preview-caption { display: flex; justify-content: space-between; margin-bottom: 11px; color: var(--muted); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.qr-window { background: var(--paper-raised); border: 1px solid var(--line); box-shadow: 14px 14px 0 color-mix(in oklch, var(--line) 30%, transparent); }
.window-bar { height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 16px; border-bottom: 1px dashed var(--line); color: var(--ink-soft); font-size: 10px; }
.window-dots { display: flex; gap: 5px; }
.window-dots i { width: 5px; height: 5px; border: 1px solid var(--line); border-radius: 50%; }
.window-version { color: var(--muted); font-size: 9px; }
.window-more { color: var(--muted); letter-spacing: .2em; }
.qr-window-body { display: grid; grid-template-columns: 152px 1fr; gap: 16px; align-items: center; padding: 25px 24px 23px; }
.qr-visual { width: 152px; aspect-ratio: 1; display: grid; place-items: center; padding: 10px; border: 1px solid var(--line-light); background: white; }
.qr-visual img, .product-card-qr img { display: block; width: 100%; height: auto; image-rendering: pixelated; }
.qr-url { min-width: 0; }
.qr-url .micro-label { display: block; margin-bottom: 10px; font-size: 8px; }
.qr-url code, .product-card-qr code { display: block; overflow-wrap: anywhere; color: var(--ink-soft); font-size: 10px; line-height: 1.9; }
.qr-actions { grid-column: 1 / -1; display: flex; gap: 8px; }
.mini-button { padding: 7px 10px; background: var(--teal); color: white; font-size: 9px; }
.mini-button-quiet { border: 1px solid var(--line); background: transparent; color: var(--ink-soft); }
.qr-window-footer { display: flex; justify-content: space-between; padding: 10px 15px; border-top: 1px dashed var(--line); color: var(--muted); font-size: 8px; letter-spacing: .045em; }
.qr-window-footer span:first-child { color: var(--teal); font-weight: 700; }
.preview-note { margin: 16px 0 0; text-align: right; color: var(--muted); font-size: 9px; letter-spacing: .04em; }
.hero-marker { position: absolute; left: 0; bottom: 22px; color: var(--muted); font-size: 8px; line-height: 1.8; letter-spacing: .08em; }
.catalog-section { padding: 92px 0 76px; border-top: 1px dashed var(--line); }
.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 45px; }
.section-heading h2 { margin: 10px 0 0; font-size: clamp(32px, 4.4vw, 51px); line-height: 1.1; letter-spacing: -.07em; font-weight: 400; }
.catalog-count { margin: 0 0 3px; text-align: right; color: var(--teal); font-size: 18px; line-height: 1.3; }
.catalog-count > span { color: var(--line); }
.count-note { color: var(--muted); font-size: 9px; letter-spacing: .04em; }
.plugin-row { display: grid; grid-template-columns: 68px minmax(0, 1fr) 120px; gap: 26px; align-items: start; padding: 32px 0 35px; border-top: 1px dashed var(--line); }
.plugin-row:last-of-type { border-bottom: 1px dashed var(--line); }
.plugin-number { padding-top: 1px; color: var(--teal); font-size: 12px; }
.plugin-main { max-width: 720px; }
.plugin-kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.tag { display: inline-block; padding: 4px 7px; border: 1px solid var(--line); color: var(--muted); font-size: 8px; line-height: 1.4; letter-spacing: .08em; }
.tag-status { border-color: color-mix(in oklch, var(--teal) 30%, var(--line)); color: var(--teal); }
.tag-status-muted { border-color: var(--line); color: var(--ink-soft); }
.plugin-main h3 { margin: 15px 0 8px; font-size: clamp(26px, 3.4vw, 38px); font-weight: 400; line-height: 1.1; letter-spacing: -.065em; }
.inline-arrow { display: inline-block; padding-left: 11px; color: var(--teal); font-size: .52em; vertical-align: top; }
.plugin-summary { max-width: 620px; margin: 0 0 17px; color: var(--ink-soft); font-size: 12px; line-height: 1.8; }
.plugin-meta { display: flex; flex-wrap: wrap; gap: 10px 23px; color: var(--muted); font-size: 9px; }
.plugin-meta span::before { content: "+ "; color: var(--teal); }
.plugin-privacy-link { display: inline-block; margin-top: 16px; color: var(--muted); font-size: 9px; border-bottom: 1px solid var(--line); }
.plugin-privacy-link span { color: var(--teal); }
.plugin-cta { justify-self: end; margin-top: 38px; color: var(--teal); font-size: 10px; white-space: nowrap; }
.plugin-cta span { padding-left: 6px; }
.catalog-footnote { display: flex; justify-content: space-between; gap: 24px; margin-top: 13px; color: var(--muted); font-size: 9px; }
.catalog-footnote span:first-child { overflow: hidden; max-width: 60%; color: var(--line); white-space: nowrap; }
.manifesto { position: relative; overflow: hidden; padding: 83px 0 78px; background: var(--dark); color: var(--dark-ink); }
.manifesto-inner { position: relative; }
.manifesto .eyebrow { color: oklch(.68 .016 240); }
.manifesto h2 { margin: 24px 0 33px; font-size: clamp(40px, 6vw, 72px); font-weight: 400; letter-spacing: -.085em; line-height: 1.06; }
.manifesto h2 span { color: oklch(.71 .09 205); }
.manifesto-bottom { display: flex; align-items: end; justify-content: space-between; gap: 45px; max-width: 810px; }
.manifesto-bottom p { max-width: 480px; margin: 0; color: oklch(.75 .01 250); font-size: 12px; line-height: 1.9; }
.text-link-light { color: oklch(.78 .1 205); border-color: oklch(.58 .09 205); white-space: nowrap; }
.manifesto-plus { position: absolute; top: 23px; right: 8%; color: oklch(.39 .035 230); font-size: 100px; line-height: .83; }
.contact-strip { min-height: 132px; display: grid; grid-template-columns: 1fr 2fr auto; align-items: center; gap: 24px; }
.contact-strip .eyebrow { margin: 0; }
.contact-strip p:not(.eyebrow) { margin: 0; color: var(--ink-soft); font-size: 12px; }
.contact-strip .text-link { justify-self: end; }
.site-footer { border-top: 1px dashed var(--line); }
.footer-inner { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 18px; color: var(--muted); font-size: 9px; }
.footer-mark { color: var(--teal); font-size: 16px; font-weight: 700; letter-spacing: -.12em; }
.footer-inner a:not(.footer-mark):hover { color: var(--teal); }
/* Shared document and product page elements */
.document { padding: 29px 0 76px; }
.breadcrumbs { display: flex; align-items: center; gap: 12px; margin-bottom: 53px; color: var(--muted); font-size: 10px; }
.breadcrumbs a:hover { color: var(--teal); }
.breadcrumbs span[aria-current] { color: var(--ink); }
.product-hero { display: grid; grid-template-columns: minmax(0, 1fr) 260px; align-items: center; gap: 12%; padding: 0 7% 61px; }
.product-heading h1 { margin: 22px 0 16px; font-size: clamp(48px, 7vw, 76px); font-weight: 400; letter-spacing: -.09em; line-height: 1; }
.document-lede { max-width: 610px; margin-bottom: 22px; color: var(--ink-soft); font-size: 13px; line-height: 1.9; }
.product-status-line { display: flex; flex-wrap: wrap; align-items: center; gap: 13px; }
.version-label { color: var(--muted); font-size: 9px; }
.product-card-qr { width: 260px; justify-self: end; padding: 15px; border: 1px solid var(--line); background: var(--paper-raised); box-shadow: 9px 9px 0 color-mix(in oklch, var(--line) 30%, transparent); }
.product-card-qr .micro-label { margin-bottom: 10px; }
.product-card-qr img { width: 190px; margin: 0 auto 12px; padding: 10px; background: white; }
.product-card-qr code { margin-bottom: 13px; font-size: 8px; }
.product-card-qr .qr-window-footer { margin: 0 -15px -15px; }
.document-rule { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 13px 0; border-top: 1px dashed var(--line); border-bottom: 1px dashed var(--line); color: var(--muted); font-size: 8px; letter-spacing: .1em; }
.document-rule span:first-child { overflow: hidden; color: var(--line); white-space: nowrap; }
.document-grid { display: grid; grid-template-columns: 180px minmax(0, 730px); justify-content: space-between; gap: 70px; padding: 45px 7% 20px; }
.document-aside { position: sticky; top: 24px; align-self: start; }
.contents-nav { display: grid; gap: 10px; margin: 17px 0 29px; font-size: 10px; }
.contents-nav a { color: var(--ink-soft); }
.contents-nav a:hover { color: var(--teal); }
.aside-link { font-size: 10px; }
.doc-section { padding: 0 0 44px; margin-bottom: 40px; border-bottom: 1px dashed var(--line); scroll-margin-top: 30px; }
.doc-section:last-child { border-bottom: 0; }
.doc-section > .eyebrow { margin-bottom: 14px; }
.doc-section h2 { max-width: 610px; margin: 0 0 16px; font-size: clamp(25px, 3.3vw, 36px); font-weight: 400; letter-spacing: -.07em; line-height: 1.22; }
.doc-section > p:not(.eyebrow) { max-width: 680px; margin-bottom: 14px; color: var(--ink-soft); font-size: 12px; line-height: 1.9; }
.feature-list, .steps-list { margin: 26px 0 0; padding: 0; list-style: none; }
.feature-list li { display: grid; grid-template-columns: 37px 1fr; gap: 12px; padding: 16px 0; border-top: 1px dashed var(--line); }
.feature-list li > span, .steps-list li > span { color: var(--teal); font-size: 10px; }
.feature-list strong { font-size: 11px; font-weight: 500; }
.feature-list p { margin: 5px 0 0; color: var(--ink-soft); font-size: 10px; line-height: 1.8; }
.steps-list li { display: grid; grid-template-columns: 37px 1fr; gap: 12px; padding: 12px 0; border-top: 1px dashed var(--line); }
.steps-list li p { margin: 0; color: var(--ink-soft); font-size: 11px; }
.fine-print { margin-top: 19px !important; color: var(--muted) !important; font-size: 10px !important; }
.privacy-callout { padding: 25px; border: 1px dashed var(--line); background: color-mix(in oklch, var(--paper-raised) 50%, transparent); }
.privacy-callout > .text-link { margin-top: 8px; }
.privacy-callout code { padding: 2px 4px; background: var(--teal-light); color: var(--ink); font-size: .9em; }
.support-card { display: flex; justify-content: space-between; align-items: center; gap: 25px; margin: 45px 7% 18px; padding: 27px 30px; border: 1px dashed var(--line); }
.support-card h2 { margin: 6px 0 0; font-size: 22px; font-weight: 400; letter-spacing: -.05em; }
.button { display: inline-flex; align-items: center; gap: 16px; padding: 12px 16px; border: 1px solid var(--teal); color: var(--teal); font-size: 10px; }
.button:hover { background: var(--teal); color: white; }
.back-link { margin: 32px 7% 0; }
/* Prompt Composer preview */
.composer-preview { width: min(100%, 390px); justify-self: end; border: 1px solid var(--line); background: var(--paper-raised); box-shadow: 9px 9px 0 color-mix(in oklch, var(--line) 30%, transparent); }
.composer-topline, .composer-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 13px 15px; color: var(--muted); font-size: 8px; letter-spacing: .06em; }
.composer-topline { border-bottom: 1px dashed var(--line); }
.composer-symbol { color: var(--teal); font-size: 12px; font-weight: 700; }
.composer-content { padding: 22px 18px; }
.composer-label-row { display: flex; justify-content: space-between; align-items: center; }
.review-chip { padding: 3px 6px; border: 1px solid color-mix(in oklch, var(--teal) 34%, var(--line)); color: var(--teal); font-size: 7px; letter-spacing: .07em; }
.composer-lines { margin: 18px -18px 20px; padding: 14px 18px; background: oklch(.95 .006 95); color: var(--ink-soft); font-size: 9px; line-height: 2; }
.composer-lines p { display: flex; gap: 12px; margin: 0; white-space: nowrap; }
.line-num { color: var(--muted); }
.line-muted { color: var(--teal); }
.snippet-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.snippet-pill { padding: 6px 8px; border: 1px dashed var(--line); color: var(--ink-soft); font-size: 8px; }
.composer-format { display: flex; gap: 6px; margin-top: 19px; }
.composer-format span { padding: 3px 5px; border: 1px solid var(--line-light); color: var(--muted); font-size: 7px; }
.composer-format span:first-child { border-color: var(--teal); color: var(--teal); }
.composer-footer { border-top: 1px dashed var(--line); font-size: 7px; }
/* Reusable policy and support document layout */
.document .document-title { max-width: 840px; margin: 28px 0 14px; font-size: clamp(42px, 6vw, 68px); font-weight: 400; letter-spacing: -.085em; line-height: 1.05; }
.document .document-intro { max-width: 740px; margin-bottom: 42px; color: var(--ink-soft); font-size: 13px; line-height: 1.9; }
.document-body { max-width: 800px; }
.document-body section { padding: 22px 0; border-top: 1px dashed var(--line); }
.document-body h2 { margin: 0 0 12px; font-size: 20px; font-weight: 400; letter-spacing: -.045em; }
.document-body p, .document-body li { color: var(--ink-soft); font-size: 12px; line-height: 1.9; }
.document-body p:last-child { margin-bottom: 0; }
.document-body ul { padding-left: 20px; }
@media (min-width: 1450px) { .container { width: min(var(--page), calc(100% - 144px)); } }
@media (max-width: 850px) {
  .container { width: min(100% - 52px, var(--page)); }
  .hero { grid-template-columns: minmax(0, 1fr) minmax(300px, .85fr); gap: 5%; min-height: 580px; }
  .hero h1 { font-size: clamp(47px, 7vw, 68px); }
  .qr-window-body { grid-template-columns: 125px 1fr; padding: 19px; }
  .qr-visual { width: 125px; }
  .product-hero { padding-inline: 2%; gap: 7%; }
  .document-grid { padding-inline: 2%; gap: 42px; grid-template-columns: 150px minmax(0, 1fr); }
  .support-card { margin-inline: 2%; }
  .back-link { margin-inline: 2%; }
  .footer-inner { flex-wrap: wrap; padding-block: 16px; }
}
@media (max-width: 620px) {
  html { scroll-padding-top: 82px; }
  body { font-size: 13px; }
  .container { width: calc(100% - 40px); }
  .site-header { height: auto; min-height: 78px; }
  .header-inner { min-height: 78px; align-items: center; flex-wrap: wrap; padding-block: 12px 8px; }
  .wordmark-mark { font-size: 19px; }
  .site-nav { width: 100%; justify-content: space-between; gap: 8px; padding: 2px 0 3px; font-size: 9px; }
  .site-nav a { padding: 5px 0; }
  .hero { display: block; min-height: unset; padding-top: 63px; padding-bottom: 70px; }
  .hero h1 { margin-top: 25px; font-size: clamp(48px, 13vw, 68px); }
  .hero-lede { max-width: 470px; font-size: 12px; }
  .hero-preview-wrap { width: min(100%, 440px); margin: 53px auto 0; }
  .hero-marker { bottom: 17px; font-size: 7px; }
  .catalog-section { padding: 65px 0 52px; }
  .section-heading { margin-bottom: 28px; }
  .section-heading h2 { font-size: 34px; }
  .plugin-row { position: relative; grid-template-columns: 34px minmax(0,1fr); gap: 12px; padding: 24px 0 27px; }
  .plugin-number { font-size: 10px; }
  .plugin-main h3 { margin-top: 13px; font-size: 29px; }
  .plugin-summary { font-size: 11px; }
  .plugin-meta { gap: 8px 14px; font-size: 8px; }
  .plugin-cta { grid-column: 2; justify-self: start; margin-top: 17px; }
  .catalog-footnote { display: block; font-size: 8px; }
  .catalog-footnote span:first-child { display: block; max-width: 100%; margin-bottom: 7px; }
  .manifesto { padding: 62px 0 54px; }
  .manifesto h2 { font-size: clamp(39px, 10vw, 58px); }
  .manifesto-bottom { display: block; }
  .manifesto-bottom p { margin-bottom: 24px; font-size: 11px; }
  .manifesto-plus { top: 0; right: 1%; font-size: 74px; }
  .contact-strip { min-height: 0; grid-template-columns: 1fr auto; gap: 4px 16px; padding-block: 27px; }
  .contact-strip .eyebrow { grid-column: 1 / -1; }
  .contact-strip p:not(.eyebrow) { font-size: 10px; }
  .contact-strip .text-link { grid-column: 2; grid-row: 2; font-size: 9px; }
  .footer-inner { min-height: 0; display: grid; grid-template-columns: 30px 1fr; gap: 9px 13px; padding-block: 18px; font-size: 8px; }
  .footer-mark { grid-row: span 3; }
  .footer-inner > span, .footer-inner > a:not(.footer-mark) { justify-self: start; }
  .breadcrumbs { margin-bottom: 38px; }
  .document { padding-top: 22px; padding-bottom: 50px; }
  .product-hero { display: block; padding: 0 0 41px; }
  .product-heading h1 { font-size: clamp(49px, 13vw, 68px); }
  .document-lede { font-size: 11px; }
  .product-card-qr, .composer-preview { width: min(100%, 340px); margin: 35px auto 0; }
  .document-rule { font-size: 7px; }
  .document-grid { display: block; padding: 28px 0 0; }
  .document-aside { position: static; margin-bottom: 38px; padding-bottom: 20px; border-bottom: 1px dashed var(--line); }
  .contents-nav { display: flex; flex-wrap: wrap; gap: 8px 17px; margin: 11px 0 16px; font-size: 9px; }
  .doc-section { padding-bottom: 32px; margin-bottom: 30px; }
  .doc-section h2 { font-size: 26px; }
  .doc-section > p:not(.eyebrow) { font-size: 11px; }
  .feature-list p { font-size: 9px; }
  .support-card { align-items: flex-start; margin: 30px 0 15px; padding: 20px; }
  .support-card h2 { font-size: 19px; }
  .button { padding: 10px; font-size: 9px; }
  .back-link { margin-inline: 0; }
  .document .document-title { font-size: clamp(39px, 11vw, 58px); }
  .document .document-intro { font-size: 11px; }
  .document-body h2 { font-size: 18px; }
  .document-body p, .document-body li { font-size: 11px; }
}
.policy-document { max-width: 860px; padding-block: 64px 80px; overflow-wrap: anywhere; }
.policy-document h1 { margin: 24px 0; font-size: clamp(34px, 5vw, 54px); line-height: 1.08; letter-spacing: -.065em; font-weight: 400; }
.policy-document h2 { margin: 0 0 15px; font-size: 23px; line-height: 1.3; letter-spacing: -.045em; font-weight: 400; }
.policy-document h3 { font-size: 17px; font-weight: 500; }
.policy-document p, .policy-document li { font-size: 13px; line-height: 1.9; color: var(--ink-soft); }
.policy-document section { margin-top: 34px; padding-top: 28px; border-top: 1px dashed var(--line); }
.policy-document .text-link { display: inline; font-size: inherit; overflow-wrap: anywhere; }
.policy-document li { margin-bottom: 10px; }
.policy-document code { font-size: .95em; background: var(--teal-light); padding-inline: 3px; }
.policy-document .draft-note { margin-top: 10px; font-size: 11px; color: var(--teal); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }
/* Blog pages reuse the library's paper, ink and teal palette. */
.blog-index { padding-block: 70px 80px; }
.blog-index h1 { margin: 22px 0; font-size: clamp(44px,6vw,72px); line-height: 1.05; letter-spacing: -.075em; font-weight: 400; }
.blog-intro { max-width: 620px; color: var(--ink-soft); line-height: 1.9; }
.blog-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 48px; margin-top: 48px; }
.blog-card { padding: 30px 0 34px; border-top: 1px dashed var(--line); }
.blog-card h2 { margin: 14px 0; max-width: 32ch; font-weight: 400; font-size: clamp(23px,2.5vw,31px); line-height: 1.25; letter-spacing: -.045em; }
.blog-card > p:not(.eyebrow):not(.blog-meta) { max-width: 60ch; color: var(--ink-soft); font-size: 12px; line-height: 1.85; }
.blog-meta { display: flex; flex-wrap: wrap; gap: 6px 20px; color: var(--muted); font-size: 10px; line-height: 1.7; }
.blog-meta a { text-decoration: underline; text-underline-offset: 3px; }
.blog-main-link { margin: 30px 0 0; padding-top: 28px; border-top: 1px dashed var(--line); font-size: 12px; color: var(--ink-soft); }
.blog-article { max-width: 860px; padding-block: 32px 75px; }
.blog-article .breadcrumbs { margin-bottom: 45px; }
.blog-heading { margin-bottom: 36px; border-bottom: 1px dashed var(--line); padding-bottom: 26px; }
.blog-heading h1 { margin: 20px 0; font-size: clamp(35px,4.9vw,55px); line-height: 1.1; letter-spacing: -.065em; font-weight: 400; overflow-wrap: anywhere; }
.blog-deck { margin-top: 24px; margin-bottom: 0; font-size: 15px; line-height: 1.85; color: var(--ink-soft); }
.blog-body { max-width: 70ch; }
.blog-body p { font-size: 14px; line-height: 1.95; color: var(--ink-soft); margin-bottom: 22px; }
.blog-body h2 { margin: 35px 0 16px; font-size: 25px; font-weight: 400; line-height: 1.3; letter-spacing: -.045em; }
.blog-body a { color: var(--teal); text-decoration: underline; text-underline-offset: 4px; overflow-wrap: anywhere; }
.blog-related { margin-top: 45px; padding-top: 27px; border-top: 1px dashed var(--line); }
.blog-related h2 { font-size: 20px; font-weight: 400; }
@media (max-width:620px) { .blog-grid { grid-template-columns: minmax(0,1fr); } .blog-index { padding-top: 48px; } .blog-body p { font-size: 13px; } .blog-heading h1 { font-size: clamp(33px,8.5vw,47px); } .blog-meta { gap: 5px 14px; } }
.blog-body { overflow-wrap: anywhere; }