/* ============================================================
   Self-hosted fonts (latin + latin-ext subsets). Replaces the
   Google Fonts CDN request. Files in ../fonts/.
   ============================================================ */
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/barlowcondensed-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/barlowcondensed-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/barlowcondensed-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/barlowcondensed-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/dmsans-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/dmsans-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/dmsans-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/dmsans-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/dmsans-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/dmsans-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/playfairdisplay-400i-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/playfairdisplay-400i-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/playfairdisplay-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/playfairdisplay-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/playfairdisplay-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/playfairdisplay-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('../fonts/playfairdisplay-900-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('../fonts/playfairdisplay-900-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   motocrossreviews.com — main stylesheet
   Design system: motocrossreviews-design-system-2026-05-16.md
   Greyscale only. No chromatic accent. Editorial layout.
   ============================================================ */

/* ============================================================
   1. Tokens — design system custom properties
   ============================================================ */

:root {
    /* Colour */
    --bg:                  #FFFFFF;
    --bg-alt:              #F7F7F7;
    --text:                #1A1A1A;
    --text-secondary:      #444444;
    --text-muted:          #888888;
    --border:              #E5E5E5;
    --border-strong:       #1A1A1A;

    /* Functional (scoring + state — the only colour anywhere) */
    --score-high:          #15803D;  /* >= 8.0 */
    --score-mid:           #1A1A1A;  /* 5.0 - 7.9 */
    --score-low:           #DC2626;  /* < 5.0 */
    --success:             #15803D;
    --warning:             #CA8A04;
    --error:               #DC2626;

    /* Typography */
    --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
    --font-kicker:  "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
    --font-body:    "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-mono:    "JetBrains Mono", Menlo, Consolas, "Courier New", monospace;

    /* Type scale */
    --text-xs:   12px;
    --text-sm:   14px;
    --text-base: 16px;
    --text-lg:   18px;
    --text-xl:   22px;
    --text-2xl:  28px;
    --text-3xl:  36px;
    --text-4xl:  44px;

    /* Spacing scale (8px base) */
    --space-1:  4px;
    --space-2:  8px;
    --space-3:  12px;
    --space-4:  16px;
    --space-5:  24px;
    --space-6:  32px;
    --space-8:  48px;
    --space-10: 64px;
    --space-12: 96px;
    --space-16: 128px;

    /* Containers */
    --container-narrow: 720px;
    --container-medium: 960px;
    --container-wide:   1200px;
}

@media (min-width: 768px) {
    :root {
        --text-xs:   13px;
        --text-sm:   15px;
        --text-base: 17px;
        --text-lg:   20px;
        --text-xl:   26px;
        --text-2xl:  36px;
        --text-3xl:  48px;
        --text-4xl:  64px;
    }
}

/* ============================================================
   2. Reset — modern, minimal
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
html { -webkit-text-size-adjust: 100%; }
img, picture, video, canvas, svg { display: block; max-width: 100%; height: auto; }
input, button, textarea, select { font: inherit; color: inherit; }
button { background: none; border: 0; cursor: pointer; }
a { color: inherit; }
ul, ol { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }
[hidden] { display: none !important; }

/* ============================================================
   3. Base elements
   ============================================================ */

body {
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: 1.6;
    color: var(--text);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--text);
}

h1 { font-size: var(--text-3xl); }
h2 { font-size: var(--text-2xl); }
h3 { font-size: var(--text-xl); }
h4 { font-size: var(--text-lg); }
h5 { font-size: var(--text-base); }
h6 { font-size: var(--text-sm); text-transform: uppercase; letter-spacing: 0.06em; font-family: var(--font-kicker); }

p { max-width: 65ch; }

a {
    color: var(--text);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.18em;
    transition: text-decoration-thickness 120ms ease;
}
a:hover { text-decoration-thickness: 2px; }
a:focus-visible {
    outline: 2px solid var(--border-strong);
    outline-offset: 2px;
    border-radius: 2px;
}

strong, b { font-weight: 500; color: var(--text); }
em, i { font-style: italic; }

hr {
    border: 0;
    border-top: 1px solid var(--border);
    margin: var(--space-8) 0;
}

blockquote {
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-style: italic;
    line-height: 1.4;
    border-left: 2px solid var(--border-strong);
    padding-left: var(--space-5);
    margin: var(--space-6) 0;
    color: var(--text-secondary);
}

code, pre, kbd, samp {
    font-family: var(--font-mono);
    font-size: 0.92em;
}
pre {
    background: var(--bg-alt);
    padding: var(--space-4);
    overflow-x: auto;
    border: 1px solid var(--border);
}

::selection { background: var(--text); color: var(--bg); }

/* ============================================================
   4. Layout primitives
   ============================================================ */

.mrr-container {
    width: 100%;
    max-width: var(--container-medium);
    margin-inline: auto;
    padding-inline: var(--space-4);
}
.mrr-container--narrow { max-width: var(--container-narrow); }
.mrr-container--medium { max-width: var(--container-medium); }
.mrr-container--wide   { max-width: var(--container-wide); }

@media (min-width: 768px) {
    .mrr-container { padding-inline: var(--space-6); }
}

.mrr-main {
    padding-block: var(--space-8) var(--space-12);
}

/* Skip-to-content link (a11y) */
.mrr-skip {
    position: absolute;
    left: -9999px;
    top: 0;
    background: var(--text);
    color: var(--bg);
    padding: var(--space-3) var(--space-4);
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: var(--text-sm);
    z-index: 9999;
    text-decoration: none;
}
.mrr-skip:focus { left: var(--space-4); top: var(--space-4); }

/* ============================================================
   5. Site header
   ============================================================ */

.mrr-site-header {
    border-bottom: 1px solid var(--border);
    padding-block: var(--space-5);
}
.mrr-site-header__inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-3);
}

@media (min-width: 768px) {
    .mrr-site-header__inner {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        gap: var(--space-8);
    }
}

.mrr-site-mark {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: clamp(22px, 2.4vw, 28px);
    line-height: 1;
    letter-spacing: -0.02em;
}
.mrr-site-mark a {
    text-decoration: none;
    color: var(--text);
}

.mrr-site-nav__list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-5);
}
.mrr-site-nav__list a {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    text-decoration: none;
    color: var(--text-secondary);
    transition: color 120ms ease;
}
.mrr-site-nav__list a:hover { color: var(--text); }
.mrr-site-nav__list .current-menu-item a { color: var(--text); }

/* ============================================================
   6. Kicker (universal small-caps label)
   ============================================================ */

.mrr-kicker {
    font-family: var(--font-kicker);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.3;
}

/* ============================================================
   7. Page headers (archive, search, etc.)
   ============================================================ */

.mrr-page-header {
    margin-bottom: var(--space-8);
    padding-block-end: var(--space-6);
    border-bottom: 1px solid var(--border);
}
.mrr-page-header .mrr-kicker {
    margin-bottom: var(--space-3);
}
.mrr-page-title {
    font-size: var(--text-3xl);
    line-height: 1.05;
}
.mrr-page-header__desc,
.mrr-page-header__count {
    color: var(--text-secondary);
    margin-top: var(--space-4);
    max-width: 65ch;
}

/* ============================================================
   8. Card grid (archive + homepage)
   ============================================================ */

.mrr-card-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
    margin-block: var(--space-6);
}

@media (min-width: 600px) {
    .mrr-card-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-6); }
}
@media (min-width: 960px) {
    .mrr-card-grid { grid-template-columns: repeat(3, 1fr); }
}

.mrr-card { display: flex; flex-direction: column; }
.mrr-card__media {
    display: block;
    margin-bottom: var(--space-4);
    overflow: hidden;
}
.mrr-card__media img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    transition: transform 240ms ease;
}
.mrr-card__media:hover img { transform: scale(1.02); }
.mrr-card__body .mrr-kicker { margin-bottom: var(--space-2); }
.mrr-card__title {
    font-size: var(--text-lg);
    line-height: 1.2;
    margin-bottom: var(--space-3);
}
.mrr-card__title a { text-decoration: none; }
.mrr-card__title a:hover { text-decoration: underline; text-decoration-thickness: 1px; }
.mrr-card__excerpt {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.5;
}

/* ============================================================
   9. Article (single post / page)
   ============================================================ */

.mrr-article__head {
    padding-block: var(--space-6) var(--space-6);
}
.mrr-article__head .mrr-kicker {
    margin-bottom: var(--space-4);
}
.mrr-article__title {
    font-size: clamp(32px, 5vw, 56px);
    line-height: 1.05;
    margin-bottom: var(--space-5);
}
.mrr-article__deck {
    font-size: var(--text-lg);
    line-height: 1.4;
    color: var(--text-secondary);
    max-width: 60ch;
    margin-bottom: var(--space-6);
}
.mrr-article__byline {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text-muted);
}
.mrr-article__byline strong {
    color: var(--text);
    font-weight: 500;
}
.mrr-byline-kicker { color: var(--text-muted); margin-right: 4px; }
.mrr-byline-sep { margin: 0 var(--space-3); color: var(--text-muted); }

.mrr-article__hero {
    margin-block: var(--space-6) var(--space-8);
    max-width: var(--container-wide);
    margin-inline: auto;
}
.mrr-article__hero img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}
.mrr-article__hero-caption {
    margin-top: var(--space-3);
    padding-inline: var(--space-4);
    font-size: var(--text-xs);
    color: var(--text-muted);
    text-align: right;
}

.mrr-article__body {
    font-size: var(--text-lg);
    line-height: 1.65;
}
.mrr-article__body > * + * { margin-top: var(--space-5); }
.mrr-article__body h2 {
    font-size: var(--text-2xl);
    margin-top: var(--space-10);
    margin-bottom: var(--space-4);
}
.mrr-article__body h3 {
    font-size: var(--text-xl);
    margin-top: var(--space-8);
    margin-bottom: var(--space-3);
}
.mrr-article__body p { max-width: 62ch; }
.mrr-article__body figure {
    margin-block: var(--space-6);
}
.mrr-article__body figure figcaption {
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    color: var(--text-muted);
    text-align: right;
}
.mrr-article__body ul,
.mrr-article__body ol {
    padding-left: var(--space-5);
    list-style: revert;
}
.mrr-article__body li + li { margin-top: var(--space-2); }

/* Drop cap on the opening paragraph (Tablet Magazine move from s.17A) */
.mrr-article__body > p:first-of-type::first-letter {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: 4.2em;
    line-height: 0.82;
    float: left;
    margin: 0.08em var(--space-3) 0 0;
    color: var(--text);
}

.mrr-article__foot {
    padding-block: var(--space-8);
    border-top: 1px solid var(--border);
    margin-top: var(--space-10);
}
.mrr-article__tags { font-size: var(--text-sm); color: var(--text-secondary); }
.mrr-article__tags .mrr-kicker { display: inline; margin-right: var(--space-2); }

/* ============================================================
   10. Page (static page) — minimal variant of article
   ============================================================ */

.mrr-page__head { padding-block: var(--space-8) var(--space-4); }
.mrr-page__title {
    font-size: clamp(32px, 5vw, 56px);
    line-height: 1.05;
}
.mrr-page__hero {
    margin-block: var(--space-6) var(--space-8);
    max-width: var(--container-wide);
    margin-inline: auto;
}
.mrr-page__hero img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}
.mrr-page__body {
    font-size: var(--text-lg);
    line-height: 1.65;
}
.mrr-page__body > * + * { margin-top: var(--space-5); }
.mrr-page__body h2 { font-size: var(--text-2xl); margin-top: var(--space-10); margin-bottom: var(--space-4); }
.mrr-page__body h3 { font-size: var(--text-xl); margin-top: var(--space-8); margin-bottom: var(--space-3); }
.mrr-page__body p { max-width: 62ch; }
.mrr-page__body ul,
.mrr-page__body ol {
    padding-left: var(--space-5);
    list-style: revert;
}
.mrr-page__body li + li { margin-top: var(--space-2); }

/* ============================================================
   11. Pagination + post nav
   ============================================================ */

.mrr-pagination {
    margin-top: var(--space-10);
    padding-top: var(--space-6);
    border-top: 1px solid var(--border);
    display: flex;
    justify-content: center;
}
.mrr-pagination .nav-links {
    display: flex;
    gap: var(--space-3);
    flex-wrap: wrap;
}
.mrr-pagination a,
.mrr-pagination span {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    padding: var(--space-2) var(--space-3);
    color: var(--text-secondary);
    text-decoration: none;
    border: 1px solid transparent;
}
.mrr-pagination a:hover { color: var(--text); border-color: var(--border); }
.mrr-pagination .current { color: var(--text); border-color: var(--border-strong); }

.mrr-post-nav {
    margin-top: var(--space-10);
    padding-block: var(--space-8);
    border-top: 1px solid var(--border);
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}
@media (min-width: 600px) {
    .mrr-post-nav { grid-template-columns: 1fr 1fr; gap: var(--space-8); }
}
.mrr-post-nav__link {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    text-decoration: none;
}
.mrr-post-nav__link--next { text-align: right; }
.mrr-post-nav__link .mrr-kicker { color: var(--text-muted); }
.mrr-post-nav__title {
    font-family: var(--font-display);
    font-size: var(--text-lg);
    line-height: 1.3;
    color: var(--text);
}
.mrr-post-nav__link:hover .mrr-post-nav__title { text-decoration: underline; }

/* ============================================================
   12. Empty states, 404, search again
   ============================================================ */

.mrr-empty {
    text-align: center;
    color: var(--text-secondary);
    padding: var(--space-12) 0;
    font-size: var(--text-lg);
}

.mrr-404 {
    padding-block: var(--space-12);
}
.mrr-404 .mrr-kicker { margin-bottom: var(--space-4); }
.mrr-404__title {
    font-size: clamp(36px, 6vw, 64px);
    line-height: 1.05;
    margin-bottom: var(--space-6);
}
.mrr-404__body {
    font-size: var(--text-lg);
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: var(--space-8);
    max-width: 60ch;
}
.mrr-404__search,
.mrr-search-again {
    margin-top: var(--space-6);
}

/* ============================================================
   13. Search form (core WP)
   ============================================================ */

.search-form,
form[role="search"] {
    display: flex;
    gap: var(--space-2);
    max-width: 480px;
    border-bottom: 2px solid var(--border-strong);
}
.search-form label,
form[role="search"] label { flex: 1; }
.search-form input[type="search"],
form[role="search"] input[type="search"] {
    width: 100%;
    border: 0;
    padding: var(--space-3) 0;
    font-size: var(--text-lg);
    background: transparent;
    outline: none;
}
.search-form input[type="search"]::placeholder { color: var(--text-muted); }
.search-form input[type="submit"],
form[role="search"] button {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: var(--text-sm);
    padding: var(--space-2) var(--space-4);
    background: var(--text);
    color: var(--bg);
    border: 0;
    cursor: pointer;
}
.search-form input[type="submit"]:hover { background: var(--text-secondary); }

/* ============================================================
   14. Site footer
   ============================================================ */

.mrr-site-footer {
    margin-top: var(--space-12);
    padding-block: var(--space-10) var(--space-6);
    border-top: 2px solid var(--border-strong);
    background: var(--bg);
}
.mrr-site-footer__inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
}
@media (min-width: 768px) {
    .mrr-site-footer__inner {
        grid-template-columns: 2fr 1fr 1fr;
        gap: var(--space-10);
    }
}
.mrr-site-footer__col .mrr-kicker { margin-bottom: var(--space-3); }
.mrr-site-footer .mrr-site-mark { font-size: var(--text-xl); margin-bottom: var(--space-2); }
.mrr-site-footer__tagline {
    color: var(--text-secondary);
    max-width: 40ch;
}
.mrr-site-footer__list { display: flex; flex-direction: column; gap: var(--space-2); }
.mrr-site-footer__list a {
    text-decoration: none;
    color: var(--text);
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
}
.mrr-site-footer__list a:hover { text-decoration: underline; text-underline-offset: 0.18em; }
.mrr-site-footer__tag {
    display: block;
    color: var(--text-muted);
    font-family: var(--font-body);
    text-transform: none;
    letter-spacing: 0;
    font-size: var(--text-xs);
    margin-top: 2px;
}

.mrr-site-footer__legal {
    margin-top: var(--space-8);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border);
    color: var(--text-muted);
    font-size: var(--text-sm);
}

/* ============================================================
   15. Score chip + functional colours (ready for CPT phase)
   ============================================================ */

.mrr-score {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-xl);
    color: var(--score-mid);
}
.mrr-score--high { color: var(--score-high); }
.mrr-score--low  { color: var(--score-low); }
.mrr-score__total { font-family: var(--font-kicker); font-size: var(--text-sm); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.1em; }

/* ============================================================
   16. Review template (single-mr_review.php)
   ============================================================ */

.mrr-review__head {
    padding-block: var(--space-8) var(--space-6);
}
.mrr-review__head .mrr-kicker {
    margin-bottom: var(--space-4);
}
.mrr-review__title {
    font-size: clamp(34px, 5vw, 56px);
    line-height: 1.05;
    margin-bottom: var(--space-5);
}
.mrr-review__verdict {
    font-family: var(--font-display);
    font-style: italic;
    font-size: clamp(20px, 2.4vw, 26px);
    line-height: 1.35;
    color: var(--text);
    max-width: 60ch;
    margin-bottom: var(--space-6);
    padding-left: var(--space-4);
    border-left: 2px solid var(--border-strong);
}
.mrr-review__byline {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text-muted);
}
.mrr-review__byline strong {
    color: var(--text);
    font-weight: 500;
}

.mrr-review__hero {
    margin-block: var(--space-6) var(--space-10);
    max-width: var(--container-wide);
    margin-inline: auto;
    padding-inline: var(--space-4);
}
.mrr-review__hero img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}
.mrr-review__hero-caption {
    margin-top: var(--space-3);
    font-size: var(--text-xs);
    color: var(--text-muted);
    text-align: right;
}

/* Main two-col area: lede on the left, score box on the right (desktop). Stacks on mobile. */
.mrr-review__main {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
    margin-bottom: var(--space-10);
}
@media (min-width: 960px) {
    .mrr-review__main {
        grid-template-columns: 1fr 320px;
        gap: var(--space-10);
    }
}
.mrr-review__lede {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}
.mrr-review__summary {
    font-size: var(--text-lg);
    line-height: 1.5;
}
.mrr-review__summary .mrr-kicker {
    margin-bottom: var(--space-3);
}
.mrr-review__summary p {
    max-width: 60ch;
}

.mrr-review__body {
    font-size: var(--text-lg);
    line-height: 1.65;
    margin-bottom: var(--space-10);
}
.mrr-review__body > * + * { margin-top: var(--space-5); }
.mrr-review__body h2 { font-size: var(--text-2xl); margin-top: var(--space-10); margin-bottom: var(--space-4); }
.mrr-review__body h3 { font-size: var(--text-xl); margin-top: var(--space-8); margin-bottom: var(--space-3); }
.mrr-review__body p { max-width: 62ch; }
.mrr-review__body ul,
.mrr-review__body ol {
    padding-left: var(--space-5);
    list-style: revert;
}
.mrr-review__body li + li { margin-top: var(--space-2); }

/* Drop cap on the opening paragraph of the review body */
.mrr-review__body > p:first-of-type::first-letter {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: 4.2em;
    line-height: 0.82;
    float: left;
    margin: 0.08em var(--space-3) 0 0;
    color: var(--text);
}

.mrr-review__audience {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    margin-top: var(--space-10);
    padding-top: var(--space-8);
    border-top: 1px solid var(--border);
}
@media (min-width: 600px) {
    .mrr-review__audience { grid-template-columns: 1fr 1fr; gap: var(--space-8); }
}
.mrr-review__audience-col .mrr-kicker { margin-bottom: var(--space-3); }
.mrr-review__audience-col p { line-height: 1.55; color: var(--text-secondary); }

.mrr-review__bottom-line {
    margin-block: var(--space-10);
    padding: var(--space-6) var(--space-5);
    border-top: 2px solid var(--border-strong);
    border-bottom: 1px solid var(--border);
}
.mrr-review__bottom-line .mrr-kicker { margin-bottom: var(--space-3); }
.mrr-review__bottom-line p {
    font-family: var(--font-display);
    font-style: italic;
    font-size: var(--text-xl);
    line-height: 1.4;
    color: var(--text);
}

/* ============================================================
   17. Score box component
   ============================================================ */

.mrr-score-box {
    background: var(--bg-alt);
    padding: var(--space-6);
    border-top: 2px solid var(--border-strong);
}
.mrr-score-box__kicker {
    color: var(--text-secondary);
    margin-bottom: var(--space-3);
}
.mrr-score-box__overall {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 4px;
}
.mrr-score-box__overall-num {
    font-family: var(--font-display);
    font-size: 56px;
    line-height: 1;
    font-weight: 700;
    color: var(--text);
    letter-spacing: -0.03em;
}
.mrr-score-box__overall-suffix {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: var(--text-sm);
    color: var(--text-muted);
}
.mrr-score-box__overall.mrr-score--high .mrr-score-box__overall-num { color: var(--score-high); }
.mrr-score-box__overall.mrr-score--low .mrr-score-box__overall-num { color: var(--score-low); }
.mrr-score-box__overall-label {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-bottom: var(--space-5);
}
.mrr-score-box__group + .mrr-score-box__group {
    margin-top: var(--space-5);
    padding-top: var(--space-5);
    border-top: 1px solid var(--border);
}
.mrr-score-box__group-label {
    margin-bottom: var(--space-3);
}
.mrr-score-box__list { margin: 0; }
.mrr-score-box__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 6px 0;
    border-bottom: 1px dotted var(--border);
}
.mrr-score-box__row:last-child { border-bottom: 0; }
.mrr-score-box__row dt {
    font-size: var(--text-sm);
    color: var(--text-secondary);
}
.mrr-score-box__row dd {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-base);
    color: var(--text);
}
.mrr-score-box__row dd.mrr-score--high { color: var(--score-high); }
.mrr-score-box__row dd.mrr-score--low  { color: var(--score-low); }
.mrr-score-box__meta {
    margin-top: var(--space-5);
    padding-top: var(--space-5);
    border-top: 1px solid var(--border);
}
.mrr-score-box__meta .mrr-kicker { margin-bottom: var(--space-2); }
.mrr-score-box__meta-row {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin: 2px 0;
}
.mrr-score-box__meta-row strong { color: var(--text); font-weight: 500; }
.mrr-score-box__sample {
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    color: var(--text-muted);
}

/* Sticky on desktop in the review main grid */
@media (min-width: 960px) {
    .mrr-review__main .mrr-score-box {
        position: sticky;
        top: var(--space-5);
        align-self: start;
    }
}

/* ============================================================
   18. Pros / Cons component
   ============================================================ */

.mrr-proscons {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
    padding: var(--space-5) 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}
@media (min-width: 600px) {
    .mrr-proscons { grid-template-columns: 1fr 1fr; gap: var(--space-8); }
}
.mrr-proscons__kicker { margin-bottom: var(--space-3); }
.mrr-proscons__col--pros .mrr-proscons__kicker { color: var(--success); }
.mrr-proscons__col--cons .mrr-proscons__kicker { color: var(--warning); }
.mrr-proscons__list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.mrr-proscons__list li {
    position: relative;
    padding-left: var(--space-5);
    margin: var(--space-3) 0;
    line-height: 1.5;
    font-size: var(--text-base);
}
.mrr-proscons__col--pros .mrr-proscons__list li::before {
    content: "+";
    position: absolute;
    left: 0;
    top: 0;
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--success);
}
.mrr-proscons__col--cons .mrr-proscons__list li::before {
    content: "−";
    position: absolute;
    left: 0;
    top: 0;
    font-family: var(--font-display);
    font-weight: 700;
    color: var(--warning);
}

/* ============================================================
   19. Comparison table component
   ============================================================ */

.mrr-comparison {
    margin-block: var(--space-10);
    padding-block: var(--space-8);
    border-top: 2px solid var(--border-strong);
    border-bottom: 1px solid var(--border);
}
.mrr-comparison__header { margin-bottom: var(--space-6); }
.mrr-comparison__header .mrr-kicker { margin-bottom: var(--space-2); }
.mrr-comparison__title {
    font-size: var(--text-2xl);
    line-height: 1.15;
}
.mrr-comparison__scroll {
    overflow-x: auto;
}
.mrr-comparison__table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    min-width: 600px;
}
.mrr-comparison__table th,
.mrr-comparison__table td {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--border);
}
.mrr-comparison__row-label {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    font-weight: 500;
    width: 120px;
}
.mrr-comparison__col {
    font-family: var(--font-body);
    font-weight: 400;
    vertical-align: bottom;
    border-bottom: 2px solid var(--border-strong);
    padding-bottom: var(--space-4) !important;
}
.mrr-comparison__col .mrr-kicker {
    display: block;
    color: var(--text-muted);
    margin-bottom: 4px;
    font-size: var(--text-xs);
}
.mrr-comparison__col--ours .mrr-kicker { color: var(--text); }
.mrr-comparison__product {
    display: block;
    font-family: var(--font-display);
    font-size: var(--text-lg);
    line-height: 1.2;
    color: var(--text);
}
.mrr-comparison__product a { text-decoration: none; }
.mrr-comparison__product a:hover { text-decoration: underline; }
.mrr-comparison__score {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-lg);
}
.mrr-comparison__one-line {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.45;
}

/* ============================================================
   20. Photo strip component
   ============================================================ */

.mrr-photo-strip {
    margin-block: var(--space-10);
}
.mrr-photo-strip__header { margin-bottom: var(--space-5); }
.mrr-photo-strip__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3);
}
@media (min-width: 600px) { .mrr-photo-strip__grid { grid-template-columns: repeat(3, 1fr); gap: var(--space-4); } }
@media (min-width: 960px) { .mrr-photo-strip__grid { grid-template-columns: repeat(4, 1fr); } }
.mrr-photo-strip__item { margin: 0; }
.mrr-photo-strip__item img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}
.mrr-photo-strip__caption {
    margin-top: var(--space-2);
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-xs);
    color: var(--text-muted);
}

/* ============================================================
   21. Disclosure block
   ============================================================ */

.mrr-disclosure {
    margin-block: var(--space-10);
    padding: var(--space-5);
    background: var(--bg-alt);
    border-left: 3px solid var(--border-strong);
}
.mrr-disclosure .mrr-kicker { margin-bottom: var(--space-2); }
.mrr-disclosure__text {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    line-height: 1.55;
    margin: var(--space-2) 0;
}

/* ============================================================
   22. Bike-specific extras
   ============================================================ */

.mrr-score-box__weight {
    display: block;
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-xs);
    color: var(--text-muted);
}
.mrr-spec-block {
    padding: var(--space-5) 0;
    border-top: 1px solid var(--border);
}
.mrr-spec-block .mrr-kicker { margin-bottom: var(--space-3); }
.mrr-spec-block__list { display: flex; flex-direction: column; gap: 0; }
.mrr-spec-block__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 8px 0;
    border-bottom: 1px dotted var(--border);
    font-size: var(--text-sm);
}
.mrr-spec-block__row:last-child { border-bottom: 0; }
.mrr-spec-block__row dt { color: var(--text-secondary); }
.mrr-spec-block__row dd { color: var(--text); font-family: var(--font-display); font-weight: 700; }

.mrr-review__year-changes {
    margin-block: var(--space-8);
    padding: var(--space-5);
    background: var(--bg-alt);
    border-left: 3px solid var(--border-strong);
}
.mrr-review__year-changes .mrr-kicker { margin-bottom: var(--space-3); }
.mrr-review__year-changes p { margin: var(--space-3) 0; line-height: 1.55; }

/* ============================================================
   23. Brand page
   ============================================================ */

.mrr-brand__head { padding-block: var(--space-8) var(--space-6); }
.mrr-brand__head .mrr-kicker { margin-bottom: var(--space-4); }
.mrr-brand__hero {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}
@media (min-width: 600px) {
    .mrr-brand__hero { grid-template-columns: 200px 1fr; align-items: center; }
}
.mrr-brand__logo {
    background: var(--bg-alt);
    padding: var(--space-4);
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.mrr-brand__logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.mrr-brand__title {
    font-size: clamp(36px, 5vw, 56px);
    line-height: 1.05;
    margin-bottom: var(--space-4);
}
.mrr-brand__meta {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-3) var(--space-5);
    font-size: var(--text-sm);
}
.mrr-brand__meta dt {
    color: var(--text-muted);
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-xs);
}
.mrr-brand__meta dd { color: var(--text); margin-top: 2px; }
.mrr-brand__meta a { text-decoration: none; }
.mrr-brand__meta a:hover { text-decoration: underline; }

.mrr-brand__body {
    margin-block: var(--space-8);
    font-size: var(--text-lg);
    line-height: 1.65;
}
.mrr-brand__body > * + * { margin-top: var(--space-4); }

.mrr-brand__pitch {
    margin-block: var(--space-10);
    padding: var(--space-8);
    background: var(--bg-alt);
    border-top: 2px solid var(--border-strong);
    border-bottom: 1px solid var(--border);
}
.mrr-brand__pitch .mrr-kicker { color: var(--text-secondary); margin-bottom: var(--space-3); }
.mrr-brand__pitch-title {
    font-size: clamp(24px, 3vw, 36px);
    line-height: 1.15;
    margin-bottom: var(--space-4);
}
.mrr-brand__pitch-body {
    font-size: var(--text-lg);
    line-height: 1.55;
    color: var(--text-secondary);
    margin-bottom: var(--space-5);
}
.mrr-brand__pitch-body a { color: var(--text); }

.mrr-brand__reviews {
    margin-block: var(--space-10);
}
.mrr-brand__reviews-head { margin-bottom: var(--space-6); }
.mrr-brand__reviews-head .mrr-kicker { margin-bottom: var(--space-2); }
.mrr-brand__reviews-title { font-size: var(--text-2xl); line-height: 1.2; }

.mrr-card__score {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-base);
    color: var(--text);
    margin-top: var(--space-2);
}

/* ============================================================
   24. Buttons (generic)
   ============================================================ */

.mrr-button {
    display: inline-flex;
    align-items: center;
    padding: var(--space-3) var(--space-5);
    background: var(--text);
    color: var(--bg);
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: var(--text-sm);
    text-decoration: none;
    border: 1px solid var(--text);
    transition: background 120ms ease, color 120ms ease;
}
.mrr-button:hover { background: var(--text-secondary); border-color: var(--text-secondary); color: var(--bg); }
.mrr-button--outline {
    background: transparent;
    color: var(--text);
}
.mrr-button--outline:hover { background: var(--text); color: var(--bg); }

/* ============================================================
   25. Archive headers + filter bar
   ============================================================ */

.mrr-archive__head {
    padding-block: var(--space-8) var(--space-6);
    border-bottom: 1px solid var(--border);
    margin-bottom: var(--space-8);
}
.mrr-archive__head .mrr-kicker { margin-bottom: var(--space-3); }
.mrr-archive__title {
    font-size: clamp(36px, 5vw, 56px);
    line-height: 1.05;
    margin-bottom: var(--space-4);
}
.mrr-archive__desc {
    font-size: var(--text-lg);
    line-height: 1.55;
    color: var(--text-secondary);
    max-width: 65ch;
}
.mrr-archive__desc a { color: var(--text); }

.mrr-archive__filter {
    margin-bottom: var(--space-8);
    padding-bottom: var(--space-6);
    border-bottom: 1px solid var(--border);
}
.mrr-archive__filter-kicker { margin-bottom: var(--space-3); }
.mrr-archive__filter-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    list-style: none;
    padding: 0;
}
.mrr-archive__filter-list a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px var(--space-3);
    border: 1px solid var(--border);
    text-decoration: none;
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text);
    transition: background 120ms ease, border-color 120ms ease;
}
.mrr-archive__filter-list a:hover {
    background: var(--bg-alt);
    border-color: var(--border-strong);
}
.mrr-archive__filter-count {
    color: var(--text-muted);
    font-size: var(--text-xs);
}

/* ============================================================
   26. Brand directory grid
   ============================================================ */

.mrr-brand-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-2);
}
@media (min-width: 480px) { .mrr-brand-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 768px) { .mrr-brand-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .mrr-brand-grid { grid-template-columns: repeat(4, 1fr); } }

.mrr-brand-card {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-4);
    min-height: 96px;
    border: 1px solid var(--border);
    text-decoration: none;
    transition: border-color 120ms ease, background 120ms ease;
}
.mrr-brand-card:hover {
    border-color: var(--border-strong);
    background: var(--bg-alt);
}
.mrr-brand-card__logo {
    width: 48px;
    height: 48px;
    background: var(--bg-alt);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-bottom: var(--space-1);
}
.mrr-brand-card__logo img { max-width: 80%; max-height: 80%; object-fit: contain; }
.mrr-brand-card__name {
    font-family: var(--font-display);
    font-size: var(--text-lg);
    color: var(--text);
    line-height: 1.15;
    margin-top: auto;
}
.mrr-brand-card__status {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-xs);
    color: var(--text-muted);
}
.mrr-brand-card--reviewed .mrr-brand-card__status { color: var(--success); }
.mrr-brand-card--in_testing .mrr-brand-card__status { color: var(--warning); }

/* ============================================================
   27. Comparison tool
   ============================================================ */

[x-cloak] { display: none !important; }

.mrr-compare__controls {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
    padding-bottom: var(--space-6);
    border-bottom: 1px solid var(--border);
}
@media (min-width: 600px) {
    .mrr-compare__controls { grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
}
.mrr-compare__control { display: flex; flex-direction: column; gap: var(--space-2); }
.mrr-compare__control select {
    appearance: none;
    border: 1px solid var(--border-strong);
    background: var(--bg);
    padding: var(--space-3) var(--space-4);
    font-family: var(--font-body);
    font-size: var(--text-base);
    cursor: pointer;
    border-radius: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231A1A1A' stroke-width='2' fill='none'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right var(--space-4) center;
    padding-right: var(--space-8);
}

.mrr-compare__selbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    background: var(--bg-alt);
    border: 1px solid var(--border-strong);
    margin-bottom: var(--space-5);
    position: sticky;
    top: 0;
    z-index: 10;
}
.mrr-compare__selcount {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text-secondary);
}
.mrr-compare__selchip {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: 4px var(--space-3);
    background: var(--bg);
    border: 1px solid var(--border);
    font-size: var(--text-sm);
}
.mrr-compare__selchip button {
    font-size: 18px;
    line-height: 1;
    color: var(--text-muted);
    padding: 0;
}
.mrr-compare__selchip button:hover { color: var(--text); }
.mrr-compare__clear {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.mrr-compare__table {
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
}
.mrr-compare__table th,
.mrr-compare__table td {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}
.mrr-compare__table thead th {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-xs);
    color: var(--text-muted);
    border-bottom: 2px solid var(--border-strong);
    font-weight: 500;
}
.mrr-compare__table tbody tr.is-selected { background: var(--bg-alt); }
.mrr-compare__check input { width: 18px; height: 18px; cursor: pointer; accent-color: var(--text); }
.mrr-compare__prod { text-decoration: none; display: flex; flex-direction: column; }
.mrr-compare__prod-name { font-family: var(--font-display); font-size: var(--text-base); color: var(--text); line-height: 1.2; }
.mrr-compare__prod:hover .mrr-compare__prod-name { text-decoration: underline; }
.mrr-compare__prod-year { font-size: var(--text-xs); color: var(--text-muted); }
.mrr-compare__table .mrr-compare__score {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-lg);
}
.mrr-compare__score.mrr-score--high { color: var(--score-high); }
.mrr-compare__score.mrr-score--low { color: var(--score-low); }

/* ============================================================
   28. Comparison pair (side-by-side)
   ============================================================ */

.mrr-pair__head { padding-block: var(--space-8) var(--space-6); }
.mrr-pair__head .mrr-kicker { margin-bottom: var(--space-3); }
.mrr-pair__title { font-size: clamp(28px, 4vw, 44px); line-height: 1.1; }

.mrr-pair__cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
    margin-block: var(--space-6) var(--space-8);
}
@media (min-width: 600px) { .mrr-pair__cards { gap: var(--space-8); } }
.mrr-pair__card {
    position: relative;
    padding: var(--space-5);
    border: 1px solid var(--border);
    text-align: center;
}
.mrr-pair__card--winner { border: 2px solid var(--border-strong); }
.mrr-pair__badge {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--text);
    color: var(--bg);
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: var(--text-xs);
    padding: 4px var(--space-3);
}
.mrr-pair__img { display: block; margin-bottom: var(--space-4); }
.mrr-pair__img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.mrr-pair__card-title { font-size: var(--text-lg); line-height: 1.2; margin-bottom: var(--space-3); }
.mrr-pair__card-title a { text-decoration: none; }
.mrr-pair__card-title a:hover { text-decoration: underline; }
.mrr-pair__card-score { display: flex; align-items: baseline; justify-content: center; gap: 4px; margin-bottom: var(--space-3); }
.mrr-pair__card-num { font-family: var(--font-display); font-weight: 700; font-size: 44px; line-height: 1; }
.mrr-pair__card-suffix { font-family: var(--font-kicker); text-transform: uppercase; letter-spacing: 0.1em; font-size: var(--text-sm); color: var(--text-muted); }
.mrr-pair__verdict { font-size: var(--text-sm); color: var(--text-secondary); line-height: 1.45; }

.mrr-pair__table { width: 100%; border-collapse: collapse; min-width: 480px; }
.mrr-pair__table th,
.mrr-pair__table td {
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--border);
    text-align: center;
}
.mrr-pair__table th[scope="row"] {
    text-align: left;
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    font-weight: 500;
}
.mrr-pair__table td {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-base);
}
.mrr-pair__table-overall td { font-size: var(--text-xl); }
.mrr-pair__table-overall th { color: var(--text); }
.mrr-pair__back { margin-top: var(--space-8); }
.mrr-pair__back a { font-family: var(--font-kicker); text-transform: uppercase; letter-spacing: 0.08em; font-size: var(--text-sm); }

/* ============================================================
   29. Homepage
   ============================================================ */

/* Hero */
.mrr-home-hero {
    padding-block: var(--space-12) var(--space-8);
    text-align: center;
    border-bottom: 1px solid var(--border);
}
.mrr-home-hero__kicker {
    color: var(--text-secondary);
    margin-bottom: var(--space-5);
}
.mrr-home-hero__sep { color: var(--text-muted); margin: 0 4px; }
.mrr-home-hero__title {
    font-size: clamp(40px, 7vw, 80px);
    line-height: 1.02;
    letter-spacing: -0.02em;
    margin-bottom: var(--space-5);
    max-width: 16ch;
    margin-inline: auto;
}
.mrr-home-hero__title a { text-decoration: none; color: var(--text); }
.mrr-home-hero__title a:hover { text-decoration: underline; text-underline-offset: 0.1em; }
.mrr-home-hero__verdict {
    font-family: var(--font-display);
    font-style: italic;
    font-size: clamp(18px, 2.4vw, 24px);
    line-height: 1.4;
    color: var(--text-secondary);
    max-width: 52ch;
    margin: 0 auto var(--space-6);
}
.mrr-home-hero__foot {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-6);
    flex-wrap: wrap;
}
.mrr-home-hero__score {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 40px;
    line-height: 1;
    color: var(--text);
}
.mrr-home-hero__score.mrr-score--high { color: var(--score-high); }
.mrr-home-hero__score.mrr-score--low  { color: var(--score-low); }
.mrr-home-hero__score-suffix {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-left: 4px;
}
.mrr-home-hero__cta {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: var(--text-sm);
    text-decoration: none;
    color: var(--text);
    border-bottom: 2px solid var(--border-strong);
    padding-bottom: 2px;
}
.mrr-home-hero__cta:hover { color: var(--text-secondary); }

/* Stats bar */
.mrr-home-stats {
    border-bottom: 2px solid var(--border-strong);
    padding-block: var(--space-6);
}
.mrr-home-stats__inner {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-5);
    text-align: center;
}
@media (min-width: 700px) { .mrr-home-stats__inner { grid-template-columns: repeat(4, 1fr); } }
.mrr-home-stat { display: flex; flex-direction: column; gap: 4px; }
.mrr-home-stat__num {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: clamp(28px, 4vw, 40px);
    line-height: 1;
    color: var(--text);
}
.mrr-home-stat__num--word { font-style: italic; font-weight: 400; }
.mrr-home-stat__label {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-xs);
    color: var(--text-muted);
}

/* Comparison feature (the moat) — dark card */
.mrr-home-compare {
    background: var(--text);
    color: var(--bg);
    padding: var(--space-10) var(--space-8);
    margin-block: var(--space-12);
}
@media (min-width: 768px) {
    .mrr-home-compare { padding: var(--space-12) var(--space-10); }
}
.mrr-home-compare__body { max-width: 60ch; }
.mrr-home-compare__kicker { color: rgba(255,255,255,0.6); margin-bottom: var(--space-4); }
.mrr-home-compare__title {
    color: var(--bg);
    font-size: clamp(30px, 4.5vw, 52px);
    line-height: 1.05;
    margin-bottom: var(--space-5);
}
.mrr-home-compare__desc {
    color: rgba(255,255,255,0.8);
    font-size: var(--text-lg);
    line-height: 1.55;
    margin-bottom: var(--space-6);
    max-width: 56ch;
}
.mrr-button--invert {
    background: var(--bg);
    color: var(--text);
    border-color: var(--bg);
}
.mrr-button--invert:hover { background: var(--bg-alt); color: var(--text); border-color: var(--bg-alt); }

/* Section heads */
.mrr-home-section { margin-block: var(--space-12); }
.mrr-home-section__head {
    margin-bottom: var(--space-6);
    padding-bottom: var(--space-4);
    border-bottom: 1px solid var(--border);
}
.mrr-home-section__head .mrr-kicker { margin-bottom: var(--space-2); }
.mrr-home-section__title { font-size: var(--text-2xl); line-height: 1.1; }

/* Browse by category */
.mrr-home-cats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-2);
}
@media (min-width: 600px) { .mrr-home-cats { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 960px) { .mrr-home-cats { grid-template-columns: repeat(4, 1fr); } }
.mrr-home-cat {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-4);
    border: 1px solid var(--border);
    text-decoration: none;
    transition: border-color 120ms ease, background 120ms ease;
}
.mrr-home-cat:hover { border-color: var(--border-strong); background: var(--bg-alt); }
.mrr-home-cat__name { font-family: var(--font-display); font-size: var(--text-lg); color: var(--text); }
.mrr-home-cat__count {
    font-family: var(--font-kicker);
    font-size: var(--text-sm);
    color: var(--text-muted);
}
.mrr-home-cat--all { justify-content: center; }
.mrr-home-cat--all .mrr-home-cat__name { font-style: italic; }

/* Trust cards */
.mrr-home-trust {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
}
@media (min-width: 700px) { .mrr-home-trust { grid-template-columns: 1fr 1fr; gap: var(--space-6); } }
.mrr-home-trust__card {
    display: block;
    padding: var(--space-8);
    border: 1px solid var(--border);
    text-decoration: none;
    transition: border-color 120ms ease, background 120ms ease;
}
.mrr-home-trust__card:hover { border-color: var(--border-strong); background: var(--bg-alt); }
.mrr-home-trust__card .mrr-kicker { color: var(--text-secondary); margin-bottom: var(--space-3); }
.mrr-home-trust__title { font-size: var(--text-2xl); line-height: 1.1; margin-bottom: var(--space-4); }
.mrr-home-trust__desc { color: var(--text-secondary); line-height: 1.55; margin-bottom: var(--space-4); }
.mrr-home-trust__cta {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text);
}

/* ============================================================
   30. Best-of round-ups
   ============================================================ */

.mrr-roundup__head { padding-block: var(--space-8) var(--space-6); }
.mrr-roundup__head .mrr-kicker { margin-bottom: var(--space-4); }
.mrr-roundup__title {
    font-size: clamp(34px, 5vw, 56px);
    line-height: 1.05;
    margin-bottom: var(--space-5);
}
.mrr-roundup__intro {
    font-size: var(--text-lg);
    line-height: 1.55;
    color: var(--text-secondary);
    max-width: 62ch;
    margin-bottom: var(--space-5);
}

.mrr-roundup__table-wrap { margin-block: var(--space-6) var(--space-10); }
.mrr-roundup__table { min-width: 640px; }
.mrr-roundup__table thead th {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-xs);
    color: var(--text-muted);
    border-bottom: 2px solid var(--border-strong);
    text-align: left;
    padding: var(--space-3) var(--space-4);
}
.mrr-roundup__table td {
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}
.mrr-roundup__rank {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-lg);
    color: var(--text-muted);
    width: 40px;
}
.mrr-roundup__tprod {
    font-family: var(--font-display);
    font-size: var(--text-base);
    color: var(--text);
    text-decoration: none;
}
.mrr-roundup__tprod:hover { text-decoration: underline; }

.mrr-roundup__picks { display: flex; flex-direction: column; gap: var(--space-8); }
.mrr-roundup__pick {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
    padding-bottom: var(--space-8);
    border-bottom: 1px solid var(--border);
}
@media (min-width: 720px) {
    .mrr-roundup__pick { grid-template-columns: 300px 1fr; gap: var(--space-8); }
}
.mrr-roundup__pick-media { position: relative; }
.mrr-roundup__pick-media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.mrr-roundup__num {
    position: absolute;
    top: 0; left: 0;
    background: var(--text);
    color: var(--bg);
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-xl);
    width: 48px; height: 48px;
    display: flex; align-items: center; justify-content: center;
}
.mrr-roundup__bestfor { color: var(--text-secondary); margin-bottom: var(--space-2); }
.mrr-roundup__pick-title { font-size: var(--text-2xl); line-height: 1.1; margin-bottom: var(--space-3); }
.mrr-roundup__pick-title a { text-decoration: none; color: var(--text); }
.mrr-roundup__pick-title a:hover { text-decoration: underline; }
.mrr-roundup__pick-meta { display: flex; align-items: baseline; gap: var(--space-5); margin-bottom: var(--space-3); }
.mrr-roundup__pscore { font-family: var(--font-display); font-weight: 700; font-size: var(--text-2xl); color: var(--text); }
.mrr-roundup__pscore span { font-family: var(--font-kicker); font-size: var(--text-sm); color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.08em; margin-left: 3px; }
.mrr-roundup__pscore.mrr-score--high { color: var(--score-high); }
.mrr-roundup__pscore.mrr-score--low { color: var(--score-low); }
.mrr-roundup__price { font-family: var(--font-display); font-size: var(--text-lg); color: var(--text-secondary); }
.mrr-roundup__blurb { line-height: 1.6; color: var(--text); margin-bottom: var(--space-4); max-width: 60ch; }
.mrr-roundup__read {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text);
    text-decoration: none;
    border-bottom: 2px solid var(--border-strong);
    padding-bottom: 2px;
}
.mrr-roundup__read:hover { color: var(--text-secondary); }
.mrr-roundup__outro { margin-top: var(--space-10); }

/* ============================================================
   31. Related reviews
   ============================================================ */
.mrr-related {
    margin-top: var(--space-12);
    padding-top: var(--space-8);
    border-top: 2px solid var(--border-strong);
}
.mrr-related__head { margin-bottom: var(--space-6); }
.mrr-related__head .mrr-kicker { margin-bottom: var(--space-2); }
.mrr-related__title { font-size: var(--text-2xl); line-height: 1.1; }

/* ============================================================
   32. Archive filter bar (client-side)
   ============================================================ */
.mrr-filterbar {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
    padding: var(--space-5);
    background: var(--bg-alt);
    border: 1px solid var(--border);
    margin-bottom: var(--space-8);
}
@media (min-width: 700px) { .mrr-filterbar { grid-template-columns: repeat(3, 1fr) auto; align-items: end; } }
.mrr-filterbar__group { display: flex; flex-direction: column; gap: var(--space-2); }
.mrr-filterbar__group label { }
.mrr-filterbar select {
    appearance: none;
    border: 1px solid var(--border-strong);
    background: var(--bg);
    padding: var(--space-2) var(--space-8) var(--space-2) var(--space-3);
    font-family: var(--font-body);
    font-size: var(--text-base);
    cursor: pointer;
    border-radius: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231A1A1A' stroke-width='2' fill='none'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right var(--space-3) center;
}
.mrr-filterbar__reset {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text-secondary);
    text-decoration: underline;
    text-underline-offset: 0.2em;
    padding: var(--space-2) 0;
}
.mrr-filter-count {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-bottom: var(--space-4);
}
.mrr-card.is-hidden { display: none; }

/* ============================================================
   33. Where to buy box
   ============================================================ */
.mrr-buybox {
    background: var(--bg-alt);
    border-top: 2px solid var(--border-strong);
    padding: var(--space-5);
}
.mrr-buybox__kicker { margin-bottom: var(--space-4); }
.mrr-buybox__list { display: flex; flex-direction: column; gap: var(--space-2); }
.mrr-buybox__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background: var(--bg);
    border: 1px solid var(--border);
    text-decoration: none;
    transition: border-color 120ms ease;
}
.mrr-buybox__link:hover { border-color: var(--border-strong); }
.mrr-buybox__retailer {
    font-family: var(--font-display);
    font-size: var(--text-base);
    color: var(--text);
}
.mrr-buybox__cheapest {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-xs);
    color: var(--score-high);
    margin-left: var(--space-2);
}
.mrr-buybox__right { display: flex; align-items: baseline; gap: var(--space-4); }
.mrr-buybox__price {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-lg);
    color: var(--text);
}
.mrr-buybox__cta {
    font-family: var(--font-kicker);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--text-sm);
    color: var(--text-secondary);
}
.mrr-buybox__link:hover .mrr-buybox__cta { color: var(--text); }
.mrr-buybox__disclosure {
    margin-top: var(--space-4);
    font-size: var(--text-xs);
    color: var(--text-muted);
    line-height: 1.5;
}
.mrr-buybox__disclosure a { color: var(--text-secondary); }

/* ============================================================
   34. FAQ
   ============================================================ */
.mrr-faq { margin: var(--space-5) 0; }
.mrr-faq__list { display: flex; flex-direction: column; border-top: 1px solid var(--border); }
.mrr-faq__item { border-bottom: 1px solid var(--border); }
.mrr-faq__q {
    cursor: pointer;
    font-family: var(--font-display);
    font-size: var(--text-lg);
    color: var(--text);
    padding: var(--space-4) 2rem var(--space-4) 0;
    position: relative;
    list-style: none;
}
.mrr-faq__q::-webkit-details-marker { display: none; }
.mrr-faq__q::after {
    content: "+";
    position: absolute;
    right: 0;
    top: var(--space-4);
    font-size: 1.3em;
    line-height: 1;
    color: var(--text-secondary);
}
.mrr-faq__item[open] .mrr-faq__q::after { content: "\2013"; }
.mrr-faq__q:hover { color: var(--text-secondary); }
.mrr-faq__a { padding: 0 0 var(--space-4); color: var(--text-secondary); }
.mrr-faq__a p { margin: 0 0 var(--space-2); }
.mrr-faq__a p:last-child { margin-bottom: 0; }

/* ============================================================
   35. Brand link
   ============================================================ */
.mrr-brandlink {
    border-top: 1px solid var(--border);
    padding-top: var(--space-4);
    margin: var(--space-5) 0 0;
}
.mrr-brandlink__text {
    font-family: var(--font-display);
    font-size: var(--text-lg);
    color: var(--text);
    margin: var(--space-2) 0 0;
}
.mrr-brandlink__text a { color: var(--text); text-underline-offset: 3px; }
.mrr-brandlink__text a:hover { color: var(--text-secondary); }

/* ============================================================
   36. Reduced motion
   ============================================================ */

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Brand pitch: two CTAs side by side, stacking on a phone. */
.mrr-brand__pitch-cta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin-top: var(--space-4);
}

/* Byline link: underline on hover only, so the byline still reads as a byline. */
.mrr-byline-link { color: inherit; text-decoration: none; border-bottom: 1px solid var(--border, currentColor); }
.mrr-byline-link:hover { border-bottom-color: transparent; }