/* Editorial surfaces use the existing Rio palette and self-hosted fonts. */
.blog-hub{padding-block:46px 70px}
.blog-header{max-width:820px;margin:30px 0 36px}
.blog-header h1{font:600 clamp(36px,4vw,60px)/1.08 var(--display);letter-spacing:-.045em;margin:12px 0 20px;color:var(--text-primary)}
.blog-header>p:not(.eyebrow){font-size:18px;color:var(--text-secondary)}
.blog-shortcuts{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin-top:22px}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.blog-card{min-width:0;border:1px solid var(--border-subtle);border-radius:12px;overflow:hidden;background:var(--bg-surface);transition:border-color .18s}
.blog-card:hover{border-color:var(--brand-primary)}
.blog-card-link{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}
.blog-card-link:focus-visible{outline:3px solid var(--brand-primary);outline-offset:-4px;border-radius:12px}
.blog-card-image{position:relative;aspect-ratio:1.35;overflow:hidden;background:var(--bg-dark-section)}
.blog-card-image img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 32%;transition:transform .25s ease}
.blog-card:hover img{transform:scale(1.025)}
.blog-card-image>span{position:absolute;right:14px;bottom:14px;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:var(--bg-canvas);color:var(--text-primary);font-size:20px}
.blog-card-copy{display:flex;flex-direction:column;flex:1;padding:22px}
.blog-card-copy .eyebrow{font-size:10px;letter-spacing:.08em;color:var(--brand-primary);margin:0 0 10px}
.blog-card-copy h2{font:600 27px/1.17 var(--display);letter-spacing:-.035em;color:var(--text-primary);margin:0 0 12px}
.blog-card-copy>p:not(.eyebrow){font-size:13px;line-height:1.75;color:var(--text-secondary);margin:0 0 20px}
.blog-read{margin-top:auto;font-size:12px;font-weight:600;color:var(--brand-primary)}
.blog-bottom{margin-top:34px;padding:24px 0;border-block:1px solid var(--border-subtle);display:flex;justify-content:space-between;align-items:center;gap:20px}
.blog-bottom h2{font:600 26px/1.25 var(--display);margin:0 0 8px;color:var(--text-primary)}
.blog-bottom p{margin:0;font-size:13px;color:var(--text-secondary)}
.blog-bottom>a{flex:none}
.fieldnote{max-width:1056px}
.fieldnote-header{margin:24px 0}
.fieldnote-header h1{max-width:900px}
.fieldnote-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;font-size:12px;color:var(--text-secondary)}
.fieldnote-answer{margin:26px 0;padding:22px 26px;border:1px solid var(--border-strong);border-left:3px solid var(--brand-primary);border-radius:0 12px 12px 0;background:var(--bg-surface)}
.fieldnote-answer .eyebrow{margin:0 0 9px;font-size:10px;color:var(--brand-primary)}
.fieldnote-answer>p:last-child{margin:0;font-size:16px;line-height:1.85;color:var(--text-primary)}
.fieldnote>section{margin-block:40px}
.fieldnote>section>h2{font-size:32px;line-height:1.2;letter-spacing:-.025em}
.fieldnote-reference{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(0,1fr);align-items:center;gap:32px;padding:24px;background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:12px;margin:34px 0}
.fieldnote-reference>img{width:100%;max-height:350px;object-fit:cover;object-position:50% 24%;border-radius:8px}
.fieldnote-reference figcaption>strong{display:block;font:600 34px/1.1 var(--display);color:var(--text-primary);letter-spacing:-.035em}
.fieldnote-reference figcaption p{font-size:14px;line-height:1.8;color:var(--text-secondary)}
.fieldnote-role-map{list-style:none!important;padding:0!important;margin:24px 0!important;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.fieldnote-role-map li{position:relative;min-width:0;margin:0!important;padding:10px;background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:10px;display:flex;flex-direction:column;gap:8px}
.fieldnote-role-map img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;border-radius:6px}
.fieldnote-role-map strong{font-size:12px;line-height:1.5;color:var(--text-primary)}
.fieldnote-role-map li>span:last-child{font-size:10px;line-height:1.5;color:var(--text-secondary)}
.fieldnote-role-number{position:absolute;top:16px;left:16px;background:var(--bg-canvas);border:1px solid var(--border-strong);border-radius:4px;font:400 10px/1.3 var(--mono);padding:4px 6px;color:var(--text-primary)}
.fieldnote-checks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:24px 0}
.fieldnote-checks>div{padding:18px 15px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-surface)}
.fieldnote-checks span{display:block;font:400 11px/1.5 var(--mono);color:var(--brand-primary);margin-bottom:10px}
.fieldnote-checks strong{color:var(--text-primary);font-size:15px}
.fieldnote-checks p{font-size:12px;line-height:1.65;margin:8px 0 0;color:var(--text-secondary)}
.fieldnote-diagnosis{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:24px 0}
.fieldnote-diagnosis>div{padding:24px;border:1px solid var(--border-strong);border-radius:10px;background:var(--bg-surface)}
.fieldnote-diagnosis h3{font:600 25px/1.2 var(--display);margin:12px 0}
.fieldnote-diagnosis p{font-size:14px}
.fieldnote-diagnosis a{font-size:12px}
.fieldnote-action-list{padding:0!important;list-style:none;counter-reset:actions;display:grid;gap:12px;margin:24px 0!important}
.fieldnote-action-list li{counter-increment:actions;position:relative;padding:18px 20px 18px 62px;margin:0!important;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-surface)}
.fieldnote-action-list li::before{content:counter(actions,decimal-leading-zero);position:absolute;left:18px;top:20px;color:var(--brand-primary);font:400 12px/1.5 var(--mono)}
.fieldnote-action-list strong{display:block;font-size:15px;color:var(--text-primary)}
.fieldnote-action-list span{display:block;font-size:13px;line-height:1.75;margin-top:5px;color:var(--text-secondary)}
.fieldnote-faq details{border-top:1px solid var(--border-subtle);padding:16px 0}
.fieldnote-faq details:last-child{border-bottom:1px solid var(--border-subtle)}
.fieldnote-faq summary{cursor:pointer;color:var(--text-primary);font-weight:600;line-height:1.6;padding:4px 2px}
.fieldnote-faq summary:focus-visible{outline:2px solid var(--brand-primary);outline-offset:4px}
.fieldnote-faq details p{font-size:14px;margin:12px 0 0}
.fieldnote-next{padding:28px;border:1px solid var(--border-strong);border-radius:12px;background:var(--bg-surface)}
.fieldnote-next p{font-size:14px}
.fieldnote-related{border-top:1px solid var(--border-subtle);padding-top:26px;margin-top:42px}
.fieldnote-related h2{font:600 28px/1.2 var(--display);margin:10px 0 20px}
.fieldnote-related>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.fieldnote-related a{display:flex;flex-direction:column;gap:10px;padding:18px;border:1px solid var(--border-subtle);border-radius:8px;background:var(--bg-surface);color:var(--text-primary);text-decoration:none}
.fieldnote-related a:hover{border-color:var(--brand-primary)}
.fieldnote-related a>strong{font-size:14px;line-height:1.5}
.fieldnote-related a>span{font-size:12px;line-height:1.7;color:var(--text-secondary)}
.fieldnote .fieldnote-checked{font-size:11px;line-height:1.8;color:var(--text-secondary);margin-top:28px}
.fieldnote-formats{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1fr);align-items:center;gap:28px;padding:24px;border-radius:12px;background:var(--bg-surface);border:1px solid var(--border-subtle)}
.fieldnote-formats figure{margin:0}
.fieldnote-frame{position:relative;border:1px solid var(--border-strong);border-radius:9px;overflow:hidden}
.fieldnote-frame img{width:100%;height:100%;display:block;object-fit:cover}
.fieldnote-frame--portrait{aspect-ratio:9/16;max-height:360px;width:auto;max-width:203px;margin:auto}
.fieldnote-frame--landscape{aspect-ratio:16/9}
.fieldnote-frame b{position:absolute;left:10px;bottom:10px;border-radius:4px;padding:4px 8px;background:var(--bg-canvas);font:400 12px/1.5 var(--mono);color:var(--text-primary)}
.fieldnote-formats figcaption{display:flex;flex-direction:column;gap:5px;text-align:center;margin-top:14px;color:var(--text-primary)}
.fieldnote-formats figcaption span{font-size:11px;color:var(--text-secondary)}
.fieldnote-audio{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:22px 0}
.fieldnote-audio>div{padding:22px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-surface)}
.fieldnote-audio span{display:block;color:var(--brand-accent);font-size:28px;margin-bottom:10px}
.fieldnote-audio strong{color:var(--text-primary)}
.fieldnote-audio p{font-size:13px;line-height:1.75;margin:10px 0 0}
.fieldnote-platforms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:24px 0}
.fieldnote-platforms>section{padding:22px 18px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-surface)}
.fieldnote-platforms h3{font:600 24px/1.2 var(--display);margin:0 0 12px;color:var(--text-primary)}
.fieldnote-platforms p{font-size:13px;line-height:1.8}
.fieldnote-platforms a{font-size:12px;overflow-wrap:anywhere}
@media(max-width:900px){.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.fieldnote-platforms{grid-template-columns:1fr}.fieldnote-role-map{gap:8px}.fieldnote-role-map li{padding:7px}}
@media(max-width:639px){.blog-hub{padding-block:28px 40px}.blog-header{margin:22px 0 26px}.blog-header h1{font-size:36px}.blog-header>p:not(.eyebrow){font-size:15px}.blog-grid{grid-template-columns:1fr;gap:18px}.blog-card-image{aspect-ratio:1.5}.blog-card-copy{padding:20px}.blog-card-copy h2{font-size:27px}.blog-bottom{display:block}.blog-bottom>a{display:inline-block;margin-top:14px}.blog-shortcuts{gap:16px}.fieldnote-answer{padding:18px}.fieldnote-answer>p:last-child{font-size:14px}.fieldnote>section>h2{font-size:27px}.fieldnote-reference{grid-template-columns:1fr;padding:18px;gap:20px}.fieldnote-reference>img{aspect-ratio:1.4;max-height:none;object-position:center 27%}.fieldnote-reference figcaption>strong{font-size:29px}.fieldnote-role-map{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.fieldnote-role-map li{padding:10px}.fieldnote-role-map img{aspect-ratio:1/1;object-position:center 26%}.fieldnote-role-map strong{font-size:13px}.fieldnote-role-map li>span:last-child{font-size:11px}.fieldnote-checks{grid-template-columns:repeat(2,minmax(0,1fr))}.fieldnote-diagnosis{grid-template-columns:1fr}.fieldnote-diagnosis>div{padding:20px}.fieldnote-action-list li{padding:17px 15px 17px 52px}.fieldnote-action-list li::before{left:15px}.fieldnote-related>div{grid-template-columns:1fr}.fieldnote-next{padding:22px}.fieldnote-formats{gap:16px;padding:16px;grid-template-columns:1fr 1.2fr}.fieldnote-frame--portrait{max-height:260px}.fieldnote-formats figcaption span{font-size:10px}.fieldnote-audio{grid-template-columns:1fr}.fieldnote-meta{font-size:11px;gap:8px 14px}}
@media(prefers-reduced-motion:reduce){.blog-card,.blog-card-image img{transition:none}.blog-card:hover img{transform:none}}