/* Scout52 brand layer (2026 refresh).
   Loaded last on every page, so it wins over each page's own <style>.
   Type: Archivo only. Headlines = Archivo condensed (wdth 72) heavy italic, uppercase.
   Colour: navy #11182B + blue #3F8DFF. Blue text on light uses action blue #1F58CC (passes 4.5:1 on white and on blue tints). */

:root {
    --s52-head: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
    --s52-body: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
    --s52-navy: #11182B;
    --s52-navy-2: #1A2B53;
    --s52-navy-3: #0B1020;
    --s52-blue: #3F8DFF;
    --s52-action: #1F58CC;
    --s52-action-hover: #1A4AAD;
    --s52-sky: #9EC3F8;
    --s52-bg: #F4F6FA;
    --s52-surface: #FFFFFF;
    --s52-ink: #11182B;
    --s52-text: #2B3447;
    --s52-muted: #5B6478;
    --s52-line: #E1E6EF;
    /* Old gradient tokens become flat action blue: no gradients in the new identity. */
    --gradient-primary: linear-gradient(135deg, #1F58CC 0%, #1F58CC 100%) !important;
    --gradient-hover: linear-gradient(135deg, #1A4AAD 0%, #1A4AAD 100%) !important;
}

/* 'clip' (not 'hidden') so the sticky header keeps working */
html, body { overflow-x: clip !important; }

html body {
    margin: 0;
    background: var(--s52-bg);
    font-family: var(--s52-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::selection { background: rgba(63, 141, 255, 0.28); color: var(--s52-ink); }
:focus-visible { outline: 2px solid var(--s52-action); outline-offset: 2px; }

.header-stripe { display: none !important; }

/* ---------- Headline utility ---------- */
.s52-head {
    font-family: var(--s52-head);
    font-weight: 800;
    font-stretch: 72%;
    font-style: italic;
    text-transform: uppercase;
    letter-spacing: 0.005em;
}
.s52-eyebrow {
    font-family: var(--s52-body);
    font-weight: 700;
    font-size: 12.5px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--s52-action);
}

/* ---------- Header / nav: always navy ---------- */
html body nav:not(.breadcrumb):not([aria-label="breadcrumb"]) {
    background: var(--s52-navy) !important;
    border-bottom: 1px solid rgba(158, 195, 248, 0.12) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
/* Breadcrumb <nav>s picked up the site-wide "nav { position: fixed }" rule and sat on top of
   the header (logo and links hidden). Put them back in the page. */
html body nav.breadcrumb {
    position: static !important;
    width: auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    z-index: auto !important;
}
html body nav[aria-label="breadcrumb"] {
    position: absolute !important;
    top: 77px !important;
    left: 0 !important;
    width: 100% !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    z-index: 5 !important;
}
html body nav.scrolled { box-shadow: 0 6px 24px rgba(11, 16, 32, 0.25) !important; }

html body .logo-container,
html body .logo-link { display: flex; align-items: center; gap: 10px; text-decoration: none; }
html body nav .logo,
html body footer .logo,
html body .s52-mark {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    box-shadow: none !important;
}
html body .logo-wordmark { display: block; height: 21px; width: auto; }
html body footer .logo-wordmark { height: 19px; }
html body .footer-lockup { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
html body .footer-lockup .logo { margin: 0 !important; }

html body nav .nav-links a {
    font-family: var(--s52-head) !important;
    font-weight: 800 !important;
    font-stretch: 72%;
    font-style: italic;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 15px;
    color: #FFFFFF !important;
}
html body nav .nav-links a:hover,
html body nav .nav-links a.active { color: var(--s52-blue) !important; }
html body nav .nav-links a::after { background: var(--s52-blue) !important; }

html body nav .cta-button,
html body nav .nav-cta,
html body nav .desktop-cta {
    background: var(--s52-blue) !important;
    color: var(--s52-navy) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    font-family: var(--s52-body) !important;
    font-weight: 700 !important;
    font-style: normal !important;
    padding: 11px 20px !important;
    font-size: 15px !important;
    text-transform: none !important;
}
html body nav .cta-button:hover,
html body nav .nav-cta:hover { background: #FFFFFF !important; transform: none !important; }
html body nav .mobile-menu-toggle span { background: #FFFFFF !important; }
html body nav .login-link { color: #FFFFFF !important; font-weight: 600; }
html body nav .login-link:hover { color: var(--s52-blue) !important; }

/* ---------- Buttons: flat, 6px corners ---------- */
html body .cta-button,
html body .secondary-button,
html body .fh-btn,
html body .wc-btn-primary,
html body .wc-btn-secondary,
html body .btn,
html body .btn-primary,
html body .btn-secondary,
html body .plan-button,
html body .subscribe-button {
    border-radius: 6px !important;
    box-shadow: none !important;
    font-family: var(--s52-body);
    font-weight: 700;
}
html body .cta-button:hover,
html body .fh-btn:hover,
html body .wc-btn-primary:hover { background: var(--s52-action-hover) !important; }

/* ---------- Data tables: navy head, Opta-style ---------- */
html body table:not(.s52-plain) thead th {
    background: var(--s52-navy) !important;
    color: #FFFFFF !important;
    font-family: var(--s52-head) !important;
    font-weight: 800 !important;
    font-stretch: 72%;
    font-style: italic;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
html body table:not(.s52-plain) thead th * { color: rgba(255, 255, 255, 0.78) !important; }
html body table td { font-variant-numeric: tabular-nums; }

/* Form controls don't inherit the page font by default */
button, input, select, textarea { font-family: inherit; }

/* ---------- Footer: always navy ---------- */
html body footer {
    background: var(--s52-navy) !important;
    border-top: 0 !important;
}
html body footer h4 {
    font-family: var(--s52-head) !important;
    font-weight: 800 !important;
    font-stretch: 72%;
    font-style: italic;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #FFFFFF !important;
}

/* ---------- Transfer ticker ---------- */
.s52-ticker {
    display: flex;
    align-items: stretch;
    height: 40px;
    background: var(--s52-navy-3);
    overflow: hidden;
    position: relative;
    z-index: 2;
}
.s52-ticker-label {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    padding: 0 16px;
    background: var(--s52-blue);
    color: var(--s52-navy);
    font-family: var(--s52-head);
    font-weight: 800;
    font-stretch: 72%;
    font-style: italic;
    font-size: 14px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
}
.s52-ticker-track { display: flex; overflow: hidden; mask-image: linear-gradient(90deg, #000 92%, transparent); }
.s52-ticker-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 22px;
    border-right: 1px solid rgba(158, 195, 248, 0.15);
    white-space: nowrap;
    text-decoration: none;
}
.s52-ticker-item:hover .t-name { color: var(--s52-blue); }
.s52-ticker-item .t-name {
    font-family: var(--s52-head);
    font-weight: 800;
    font-stretch: 72%;
    font-style: italic;
    font-size: 15px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #FFFFFF;
}
.s52-ticker-item .t-move { font-size: 12px; font-weight: 600; letter-spacing: 0.04em; color: var(--s52-sky); }
.s52-ticker-item .t-fee { font-size: 12px; font-weight: 700; color: var(--s52-blue); font-variant-numeric: tabular-nums; }

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

/* Headings that don't set their own line-height would inherit the loose body value. */
h1, h2, h3 { line-height: 1.08; }
/* Page titles always take the headline style (covers the legal pages, which never used Fjalla). */
h1 { font-family: var(--s52-head); font-weight: 800; font-stretch: 72%; font-style: italic; text-transform: uppercase; }

/* ==================================================================
   STANDARD SITE HEADER (nav.s52-nav) — identical markup on every page
   ================================================================== */
html body nav.s52-nav {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--s52-navy) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(158, 195, 248, 0.12) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transform: none !important;
    z-index: 1000 !important;
    font-family: var(--s52-body);
}
html body nav.s52-nav.s52-nav--flow,
html body nav.s52-nav.s52-nav--sticky { position: sticky !important; }
html body nav.s52-nav.scrolled { box-shadow: 0 6px 24px rgba(11, 16, 32, 0.25) !important; }
html body nav.s52-nav .s52-nav-inner {
    max-width: 1376px;
    height: 72px;
    margin: 0 auto;
    padding: 0 32px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 32px;
}
html body .s52-brand { display: flex; align-items: center; gap: 10px; flex-shrink: 0; text-decoration: none !important; }
html body .s52-brand img { display: block; margin: 0; max-width: none; border-radius: 0; box-shadow: none; }
html body .s52-brand .s52-mark { width: 40px; height: 40px; }
html body .s52-brand .s52-wm { width: auto; height: 21px; }
html body nav.s52-nav .s52-links {
    display: flex;
    align-items: center;
    gap: 30px;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
    background: none;
}
html body nav.s52-nav .s52-links li { margin: 0 !important; padding: 0 !important; list-style: none !important; }
html body nav.s52-nav .s52-links a {
    display: inline-block;
    padding: 6px 0 !important;
    border-bottom: 3px solid transparent;
    font-family: var(--s52-head) !important;
    font-weight: 800 !important;
    font-stretch: 72%;
    font-style: italic;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 15px !important;
    line-height: 1.2;
    color: #FFFFFF !important;
    text-decoration: none !important;
    background: none !important;
}
html body nav.s52-nav .s52-links a::after { display: none !important; }
html body nav.s52-nav .s52-links a:hover { color: var(--s52-blue) !important; }
html body nav.s52-nav .s52-links a[aria-current="page"] { border-bottom-color: var(--s52-blue); }
html body nav.s52-nav .s52-nav-actions { display: flex; align-items: center; gap: 20px; flex-shrink: 0; }
html body nav.s52-nav .s52-signin { font-size: 15px; font-weight: 600; color: #DDE5EC !important; text-decoration: none !important; }
html body nav.s52-nav .s52-signin:hover { color: #FFFFFF !important; }
html body nav.s52-nav .s52-cta {
    display: inline-flex;
    align-items: center;
    height: 40px;
    padding: 0 18px;
    border: 1.5px solid var(--s52-blue);
    border-radius: 6px;
    background: transparent;
    font-family: var(--s52-body);
    font-size: 15px;
    font-weight: 700;
    color: #FFFFFF !important;
    text-decoration: none !important;
    white-space: nowrap;
    transition: background 0.2s ease, color 0.2s ease;
}
html body nav.s52-nav .s52-cta:hover { background: var(--s52-blue); color: var(--s52-navy) !important; }
html body nav.s52-nav .s52-burger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    margin: 0 -8px 0 0;
    padding: 10px;
    background: none;
    border: 0;
    cursor: pointer;
}
html body nav.s52-nav .s52-burger span { display: block; width: 24px; height: 2px; background: #FFFFFF; transition: transform 0.25s ease, opacity 0.25s ease; }
html body nav.s52-nav.is-open .s52-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
html body nav.s52-nav.is-open .s52-burger span:nth-child(2) { opacity: 0; }
html body nav.s52-nav.is-open .s52-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
@media (max-width: 960px) {
    html body nav.s52-nav .s52-nav-inner { padding: 0 20px; gap: 16px; justify-content: space-between; }
    html body nav.s52-nav .s52-links {
        display: none;
        position: absolute;
        top: 72px;
        left: 0;
        right: 0;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 4px 20px 20px !important;
        background: var(--s52-navy);
        border-top: 1px solid rgba(158, 195, 248, 0.12);
        box-shadow: 0 16px 32px rgba(11, 16, 32, 0.35);
    }
    html body nav.s52-nav.is-open .s52-links { display: flex; }
    html body nav.s52-nav .s52-links a { display: block; padding: 14px 0 !important; font-size: 18px !important; border-bottom: 1px solid rgba(158, 195, 248, 0.12); }
    html body nav.s52-nav .s52-links a[aria-current="page"] { color: var(--s52-blue) !important; border-bottom-color: rgba(158, 195, 248, 0.12); }
    html body nav.s52-nav .s52-signin { display: none; }
    html body nav.s52-nav .s52-burger { display: flex; }
}
@media (max-width: 400px) {
    html body .s52-brand .s52-mark { width: 34px; height: 34px; }
    html body .s52-brand .s52-wm { height: 18px; }
    html body nav.s52-nav .s52-cta { padding: 0 12px; font-size: 14px; }
}
/* Breadcrumb navs that sit under the fixed header */
html body nav[aria-label="breadcrumb"] { top: 73px !important; }

/* ==================================================================
   STANDARD SITE FOOTER (footer.s52-footer)
   ================================================================== */
html body footer.s52-footer {
    margin: 0 !important;
    padding: 64px 32px 28px !important;
    background: var(--s52-navy) !important;
    border: 0 !important;
    text-align: left !important;
    font-family: var(--s52-body);
    color: #C9D3E3;
}
html body footer.s52-footer .s52-footer-inner {
    max-width: 1312px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) repeat(4, minmax(0, 1fr));
    gap: 40px;
}
html body footer.s52-footer p { margin: 0; color: #98A2B7 !important; }
html body footer.s52-footer .s52-footer-h { color: #FFFFFF !important; }
html body footer.s52-footer span { color: inherit !important; }
html body footer.s52-footer .s52-footer-brand p { max-width: 320px; margin: 16px 0 12px; font-size: 14px; line-height: 1.6; color: #98A2B7; }
html body footer.s52-footer .s52-footer-email { font-size: 14px; font-weight: 600; color: var(--s52-blue) !important; text-decoration: none !important; }
html body footer.s52-footer .s52-footer-email:hover { color: #FFFFFF !important; }
html body footer.s52-footer .s52-social { display: flex; gap: 10px; margin-top: 18px; }
html body footer.s52-footer .s52-social a {
    display: flex; align-items: center; justify-content: center;
    width: 36px; height: 36px;
    border: 1px solid rgba(158, 195, 248, 0.25); border-radius: 50%;
    color: #DDE5EC !important;
}
html body footer.s52-footer .s52-social a:hover { border-color: var(--s52-blue); color: var(--s52-blue) !important; }
html body footer.s52-footer .s52-social svg { width: 16px; height: 16px; }
html body footer.s52-footer .s52-footer-h {
    margin: 4px 0 14px;
    font-family: var(--s52-head);
    font-weight: 800;
    font-stretch: 72%;
    font-style: italic;
    font-size: 15px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #FFFFFF;
}
html body footer.s52-footer ul { margin: 0 !important; padding: 0 !important; list-style: none !important; }
html body footer.s52-footer li { margin: 0 0 10px !important; padding: 0 !important; }
html body footer.s52-footer .s52-footer-col a { font-size: 14px; color: #98A2B7 !important; text-decoration: none !important; }
html body footer.s52-footer .s52-footer-col a:hover { color: #FFFFFF !important; }
html body footer.s52-footer .s52-footer-bottom {
    max-width: 1312px;
    margin: 48px auto 0;
    padding-top: 22px;
    border-top: 1px solid rgba(158, 195, 248, 0.12);
    font-size: 13px;
    color: #98A2B7;
}
@media (max-width: 960px) {
    html body footer.s52-footer .s52-footer-inner { grid-template-columns: 1fr 1fr; gap: 32px; }
    html body footer.s52-footer .s52-footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
    html body footer.s52-footer { padding: 48px 20px 24px !important; }
}

/* ---------- Page-title blocks line up with the text column below them ---------- */
/* Guide articles: the body column is 800px with 72px padding, so its text is 656px wide. */
html body .article-hero .article-hero-content { max-width: 656px !important; margin-left: auto !important; margin-right: auto !important; }
/* World Cup player pages + Pro guides: body is a centred 1200px layout with 5% side padding. */
html body section.page-hero,
html body section.article-hero:not(:has(.article-hero-content)) {
    padding-left: max(5%, calc((100% - 1200px) / 2 + 5%)) !important;
    padding-right: max(5%, calc((100% - 1200px) / 2 + 5%)) !important;
}
/* Let grid/flex columns shrink below their content width on phones (stops wide children pushing the page sideways). */
html body .article-layout > * { min-width: 0; }
@media (max-width: 700px) {
    /* Bare tables inside articles scroll inside themselves on phones. */
    html body .article-content > table,
    html body article > table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ==================================================================
   COMPONENTS — one button style, one label style, one chip style
   (overrides the many per-page pills, glows and gradients)
   ================================================================== */

/* Primary button: solid navy, square-ish, no glow */
html body .cta-button,
html body .cta-btn,
html body .fh-btn,
html body .wc-btn-primary,
html body .manage-btn,
html body .cta-primary,
html body .app-btn.primary,
html body .subscribe-btn.primary,
html body .plan-button,
html body .btn-primary {
    background: var(--s52-navy) !important;
    background-image: none !important;
    color: #FFFFFF !important;
    border: 1.5px solid var(--s52-navy) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    transform: none !important;
    font-family: var(--s52-body) !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-decoration: none !important;
    padding: 13px 26px !important;
    line-height: 1.3 !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}
html body .cta-button:hover,
html body .cta-btn:hover,
html body .fh-btn:hover,
html body .wc-btn-primary:hover,
html body .manage-btn:hover,
html body .cta-primary:hover,
html body .app-btn.primary:hover,
html body .subscribe-btn.primary:hover,
html body .plan-button:hover,
html body .btn-primary:hover {
    background: var(--s52-action) !important;
    border-color: var(--s52-action) !important;
    color: #FFFFFF !important;
    transform: none !important;
    box-shadow: none !important;
}

/* Secondary button: navy outline */
html body .secondary-button,
html body .cta-secondary,
html body .wc-btn-secondary,
html body .app-btn.secondary,
html body .subscribe-btn.secondary,
html body .subscribe-btn.free-btn,
html body .btn-secondary {
    background: transparent !important;
    background-image: none !important;
    color: var(--s52-navy) !important;
    border: 1.5px solid var(--s52-navy) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    transform: none !important;
    font-family: var(--s52-body) !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-decoration: none !important;
    padding: 13px 26px !important;
    line-height: 1.3 !important;
}
html body .secondary-button:hover,
html body .cta-secondary:hover,
html body .wc-btn-secondary:hover,
html body .app-btn.secondary:hover,
html body .subscribe-btn.secondary:hover,
html body .subscribe-btn.free-btn:hover,
html body .btn-secondary:hover {
    background: var(--s52-navy) !important;
    color: #FFFFFF !important;
    transform: none !important;
}
html body .app-btn svg { color: currentColor; }

/* Segmented toggle (pricing page) */
html body .plan-tab {
    border-radius: 6px !important;
    background: transparent !important;
    background-image: none !important;
    color: var(--s52-navy) !important;
    border: 1.5px solid rgba(17, 24, 43, 0.2) !important;
    box-shadow: none !important;
    font-weight: 700 !important;
}
html body .plan-tab.active { background: var(--s52-navy) !important; border-color: var(--s52-navy) !important; color: #FFFFFF !important; }

/* Page labels above titles: plain eyebrow text (as in the Matchday design) — no pill, no icon */
html body div.category-badge,
html body .article-category,
html body .article-tag,
html body .pro-badge,
html body .hero-badge,
html body .section-label {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    background: none !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    font-family: var(--s52-body) !important;
    font-style: normal !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: var(--s52-action) !important;
}
html body div.category-badge *,
html body .article-category *,
html body .pro-badge *,
html body .hero-badge * { color: inherit !important; font: inherit !important; letter-spacing: inherit !important; text-transform: inherit !important; }
html body div.category-badge svg,
html body div.category-badge .category-icon,
html body .pro-badge svg,
html body .article-tag svg,
html body .article-category svg { display: none !important; }
/* keep a small live/status dot where one exists, as a square */
html body .hero-badge span[class*="dot"], html body .hero-badge .pulse { border-radius: 2px !important; }

/* Data chips: keep their colours, lose the pill shape, borders and glows */
html body .archetype-badge,
html body .elite-badge,
html body .good-badge,
html body .rating-pill,
html body .fit,
html body .event-type-tag,
html body .price-tag,
html body .database-type,
html body .coverage-tag,
html body .phase-badge,
html body span.category-badge,
html body .badge,
html body .archetype,
html body .rec-tag,
html body .new-tag,
html body .pipeline-tag,
html body .save-badge,
html body .composite-tag,
html body .band-pill,
html body .card-pro-badge,
html body .transfer-card-badge,
html body .app-rating,
html body .transfer-badge,
html body .wc-badge {
    border-radius: 4px !important;
    border: 0 !important;
    box-shadow: none !important;
    background-image: none !important;
}
html body .archetype-badge { background: var(--s52-navy) !important; color: #FFFFFF !important; }
html body .archetype-badge.elite { background: #DABF5E !important; color: var(--s52-navy) !important; }
html body .new-tag { background: var(--s52-navy) !important; color: #FFFFFF !important; }
html body .glossary-nav a { border-radius: 4px !important; border: 1.5px solid rgba(17, 24, 43, 0.15) !important; background: #FFFFFF !important; color: var(--s52-navy) !important; font-weight: 600 !important; }
html body .glossary-nav a:hover { border-color: var(--s52-navy) !important; }
/* Breadcrumb on the World Cup player + Pro-guide templates lines up with the title block */
html body nav[aria-label="breadcrumb"] {
    padding-left: max(5%, calc((100% - 1200px) / 2 + 5%)) !important;
    padding-right: max(5%, calc((100% - 1200px) / 2 + 5%)) !important;
}
html body nav[aria-label="breadcrumb"] > * { max-width: none !important; margin-left: 0 !important; padding-left: 0 !important; }
/* Pricing trial note: flat chip, not a pill */
html body .trial-banner { border-radius: 6px !important; box-shadow: none !important; }

/* Meta lines (date · read time · author) are plain text: no calendar/clock/person icons */
html body .s52-meta > * + *::before { content: "·"; margin-right: 10px; color: var(--s52-muted); }
html body .article-meta-item + .article-meta-item::before { content: "·"; margin-right: 10px; color: var(--s52-muted); }
html body .guide-meta-item svg, html body .article-meta-item svg { display: none; }