/* ==========================================================================
   Portexa design system — the public site.

   The cover page, the capability pages, the blog and the legal pages run on
   this sheet (templates/website/_base_public.html). base.html loads it too,
   for the public header visitors see on About / Services / Contact / Pricing /
   Market Guide / News & Impact, and for the footer every page shares.

   Everything is scoped to `.pds` (tokens and components), so the app's own
   vocabularies — tm-*, hm-*, Tailwind utilities — are never touched. Colours
   are tokens; dark mode redefines the tokens under `html.dark .pds`, the same
   `dark` class and `localStorage.theme` the app uses.

   Breakpoints: 1280 container · ≤1240 header collapses to the drawer ·
   ≤1023 tablet · ≤767 phone (single column) · 320 minimum.
   ========================================================================== */

/* Tokens: the values come from the one token sheet,
   static/css/portexa/tokens.css (--public-* for the site's own neutrals,
   green and red; --color-brand-* for the brand). The names below are this
   sheet's own, kept as aliases so every rule reads as before; they follow
   html.dark because the tokens do. Radius tokens (--radius-sm … --radius-xl)
   are tokens.css's own. */
.pds {
    --background: var(--public-bg);
    --surface: var(--public-surface);
    --surface-soft: var(--public-surface-soft);
    --surface-alt: var(--public-surface-alt);

    --text-primary: var(--public-text-primary);
    --text-secondary: var(--public-text-secondary);
    --text-body: var(--public-text-body);
    --text-muted: var(--public-text-muted);

    --border: var(--public-border);
    --border-strong: var(--public-border-strong);
    --border-row: var(--public-border-row);
    /* A field's own edge: 3.7 : 1 on white (WCAG non-text contrast) — the
       decorative borders above are not enough to find an input by. */
    --control-border: var(--public-control-border);
    --control-border-hover: var(--public-control-border-hover);

    --portexa-primary: var(--color-brand-fill);
    --portexa-primary-hover: var(--color-brand-fill-hover);
    --portexa-primary-soft: var(--color-brand-soft);
    --portexa-primary-ink: var(--color-brand-primary);      /* primary used as text */
    /* The primary button (Create account, Explore Portexa …): brand blue with
       white text in light mode, a light brand blue with dark text in dark
       mode — so it reads clearly as the one call to action in both themes. */
    --pds-btn-primary-bg: var(--color-brand-button);
    --pds-btn-primary-bg-hover: var(--color-brand-primary-hover);
    --pds-btn-primary-text: var(--color-on-brand);
    --portexa-gold: var(--color-brand-gold);                /* the logo mark only */
    --portexa-gold-2: var(--color-brand-gold-2);

    --positive: var(--public-positive);
    --positive-soft: var(--public-positive-soft);
    --negative: var(--public-negative);
    --negative-soft: var(--public-negative-soft);
    --negative-ink: var(--public-negative-ink);              /* negative as small text on a tint (AA) */
    --warning: var(--color-warning);
    --warning-ink: var(--public-warning-ink);                /* warning as text (AA on white) */
    --warning-soft: var(--public-warning-soft);

    --pds-header-h: 72px;
    --pds-gutter: 32px;
    --pds-section-space: clamp(56px, 6vw, 88px);
    --pds-content-gap: clamp(28px, 3.5vw, 48px);
    --pds-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --pds-shadow-frame: 0 10px 30px rgba(0, 0, 0, 0.06);
    --pds-shadow-menu: 0 12px 32px rgba(15, 23, 42, 0.10);
    --pds-focus: 0 0 0 3px rgba(30, 78, 216, 0.38);
    --pds-ease: 160ms ease;

    font-family: var(--font-sans);
    color: var(--text-primary);
}

html.dark .pds {
    --pds-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --pds-shadow-frame: 0 10px 30px rgba(0, 0, 0, 0.35);
    --pds-shadow-menu: 0 14px 36px rgba(0, 0, 0, 0.5);
    --pds-focus: 0 0 0 3px rgba(127, 162, 255, 0.45);
}

/* ── Page frame (the public shell) ─────────────────────────────────────── */

html.pds-html { scroll-padding-top: calc(var(--pds-heading-offset, 72px) + 16px); }
body.pds {
    margin: 0;
    background: var(--background);
    font-size: 16px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
.pds *, .pds *::before, .pds *::after { box-sizing: border-box; }
/* Form controls take the page font (browsers give them their own). Zero
   specificity, so any component that sets its own font still wins. */
:where(.pds) :where(button, input, select, textarea) { font-family: inherit; }
.pds-main { overflow-x: clip; }
.pds img { max-width: 100%; }
/* Zero specificity, so every link and button class sets its own colour. */
:where(.pds) a { color: inherit; }
.pds :focus-visible { outline: none; box-shadow: var(--pds-focus); border-radius: var(--radius-sm); }

.pds-container {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 var(--pds-gutter);
}
.pds-skip {
    position: absolute; left: 12px; top: 12px; z-index: 100;
    padding: 10px 14px; border-radius: var(--radius-md);
    background: var(--portexa-primary); color: #fff; font-weight: 600; text-decoration: none;
    clip-path: inset(50%); opacity: 0; pointer-events: none;
}
.pds-skip:focus { clip-path: none; opacity: 1; pointer-events: auto; }
.pds-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pds-num { font-variant-numeric: tabular-nums; font-feature-settings: 'tnum' 1, 'lnum' 1; }

/* ── Type ──────────────────────────────────────────────────────────────── */

.pds-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    margin: 0 0 16px;
    font-size: var(--public-type-label); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--portexa-primary-ink);
}
.pds-h1 {
    margin: 0;
    max-width: 560px;
    font-size: var(--public-type-hero); font-weight: 800; line-height: 1.06; letter-spacing: -0.025em;
    color: var(--text-primary);
}
.pds-h2 {
    margin: 0;
    font-size: var(--public-type-section); font-weight: 800; line-height: 1.15; letter-spacing: -0.02em;
    color: var(--text-primary);
}
.pds-h3 { margin: 0; font-size: var(--public-type-card); font-weight: 700; line-height: 1.3; color: var(--text-primary); }
.pds-lead {
    margin: 20px 0 0;
    max-width: 580px;
    font-size: var(--public-type-lead); line-height: 1.55; color: var(--text-body);
}
.pds-body { font-size: var(--public-type-body); line-height: 1.6; color: var(--text-body); }
.pds-muted { color: var(--text-muted); }
.pds-small { font-size: var(--public-type-caption); color: var(--text-muted); }

/* ── Buttons ───────────────────────────────────────────────────────────── */

.pds-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 44px; padding: 12px 22px;
    border: 1px solid transparent; border-radius: var(--radius-md);
    font: 600 var(--public-type-card-text)/1 var(--font-sans);
    text-decoration: none; white-space: nowrap; cursor: pointer;
    transition: background-color var(--pds-ease), border-color var(--pds-ease), color var(--pds-ease);
}
.pds-btn--sm { min-height: 40px; padding: 10px 16px; font-size: var(--public-type-meta); }
.pds-btn--primary { background: var(--pds-btn-primary-bg); color: var(--pds-btn-primary-text); }
.pds-btn--primary:hover { background: var(--pds-btn-primary-bg-hover); color: var(--pds-btn-primary-text); }
.pds-btn--secondary { background: var(--surface); color: var(--text-primary); border-color: var(--border-strong); }
.pds-btn--secondary:hover { border-color: var(--text-muted); background: var(--surface-soft); }
.pds-btn--ghost { background: transparent; color: var(--text-primary); }
.pds-btn--ghost:hover { background: var(--surface-soft); }
.pds-btn--soft { background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); }
.pds-btn--soft:hover { border-color: var(--portexa-primary); }
.pds-btn i { font-size: 13px; }
.pds-link {
    display: inline-flex; align-items: center; gap: 6px;
    font-weight: 600; color: var(--portexa-primary-ink); text-decoration: none;
}
.pds-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.pds-link i { font-size: 12px; transition: transform var(--pds-ease); }
.pds-link:hover i { transform: translateX(2px); }

/* ── Chips, badges, tones ─────────────────────────────────────────────── */

.pds-badge {
    display: inline-flex; align-items: center; gap: 5px;
    height: 22px; padding: 0 8px; border-radius: 999px;
    font-size: var(--public-type-label); font-weight: 600; letter-spacing: 0.02em;
    background: var(--surface-soft); color: var(--text-secondary); border: 1px solid var(--border);
}
.pds-badge--free { background: var(--positive-soft); color: var(--positive); border-color: transparent; }
.pds-badge--primary { background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); border-color: transparent; }
.pds-badge--live::before {
    content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--positive);
}
.pds-up { color: var(--positive); }
.pds-down { color: var(--negative); }
.pds-flat { color: var(--text-muted); }
.pds-warn { color: var(--warning-ink); }

/* ==========================================================================
   Header
   ========================================================================== */

.pds-header {
    position: sticky; top: 0; z-index: 50;
    height: var(--pds-header-h);
    background: var(--surface);
    box-shadow: var(--pds-shadow-sm);
    border-bottom: 1px solid var(--border);
}
.pds-header.fixed-nav { position: fixed; top: 0; left: 0; right: 0; }
.pds-header__inner {
    display: flex; align-items: center; gap: 28px;
    height: 100%;
}
.pds-logo {
    display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0;
    color: var(--text-primary); text-decoration: none;
}
/* The brand kit's files (website/branding.py): the mark, then the wordmark —
   a light and a dark file, the theme shows one — over the brand line. */
.pds-logo__mark { display: block; height: 34px; width: auto; flex-shrink: 0; }
.pds-logo__word { display: flex; flex-direction: column; align-items: flex-start; line-height: 1; }
.pds-logo__name { display: block; height: 25px; width: auto; }
html:not(.dark) .pds-logo__name--dark,
html.dark .pds-logo__name--light { display: none; }
.pds-logo__tag {
    margin-top: 5px; font-size: 8.5px; font-weight: 600; letter-spacing: 0.13em;
    text-transform: uppercase; white-space: nowrap; color: var(--text-muted);
}

.pds-nav { display: flex; align-items: center; gap: 2px; flex: 1 1 auto; min-width: 0; }
.pds-nav__item { position: static; }
.pds-nav__item--rel { position: relative; }
.pds-nav__link {
    display: inline-flex; align-items: center; gap: 6px;
    height: 40px; padding: 0 12px; border: 0; border-radius: var(--radius-md);
    background: transparent;
    font: 500 15px/1 var(--font-sans); color: var(--text-secondary);
    text-decoration: none; cursor: pointer; white-space: nowrap;
    transition: color var(--pds-ease), background-color var(--pds-ease);
}
.pds-nav__link:hover, .pds-nav__link[aria-expanded="true"] { color: var(--text-primary); background: var(--surface-soft); }
.pds-nav__link[aria-current="page"] { color: var(--text-primary); font-weight: 600; }
.pds-nav__chev { font-size: 10px; color: var(--text-muted); transition: transform var(--pds-ease); }
.pds-nav__link[aria-expanded="true"] .pds-nav__chev { transform: rotate(180deg); }

.pds-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; flex-shrink: 0; }
.pds-icon-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: var(--radius-md);
    border: 1px solid var(--border); background: var(--surface); color: var(--text-secondary);
    cursor: pointer; transition: border-color var(--pds-ease), color var(--pds-ease);
}
.pds-icon-btn:hover { border-color: var(--border-strong); color: var(--text-primary); }
.pds-when-dark { display: none; }
html.dark .pds .pds-when-light { display: none; }
html.dark .pds .pds-when-dark { display: inline; }
.pds .pds-burger { display: none; }

/* Dropdown panels (desktop). */
.pds-menu {
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    box-shadow: var(--pds-shadow-menu);
}
.pds-menu[hidden] { display: none; }
.pds-menu--narrow {
    left: 0; right: auto; top: calc(100% + 16px); width: 360px;
    border: 1px solid var(--border); border-radius: var(--radius-lg);
}
.pds-menu--end { left: auto; right: 0; }
.pds-menu__inner { padding: 24px 0 28px; }
.pds-menu--narrow .pds-menu__inner { padding: 10px; }
.pds-menu__row {
    display: flex; gap: 12px; align-items: flex-start;
    padding: 10px 12px; border-radius: var(--radius-md);
    text-decoration: none; color: var(--text-primary);
}
.pds-menu__row:hover { background: var(--surface-soft); }
.pds-menu__icon {
    display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
    width: 32px; height: 32px; border-radius: var(--radius-md);
    background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); font-size: 14px;
}
.pds-menu__title { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; }
.pds-menu__desc { display: block; margin-top: 2px; font-size: 13px; line-height: 1.45; color: var(--text-muted); }
.pds-menu__foot {
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
    margin-top: 6px; padding: 12px 12px 4px; border-top: 1px solid var(--border);
    font-size: 13px; color: var(--text-muted);
}

/* The Capabilities mega menu: groups on the left, the chosen group's
   sub-headings and pages on the right. */
.pds-mega { display: grid; grid-template-columns: 260px 1fr; gap: 28px; }
.pds-mega__groups { display: flex; flex-direction: column; gap: 2px; border-right: 1px solid var(--border); padding-right: 16px; }
.pds-mega__group {
    display: flex; align-items: center; gap: 10px; width: 100%;
    padding: 9px 10px; border: 0; border-radius: var(--radius-md);
    background: transparent; text-align: left; cursor: pointer;
    font: 500 14px/1.3 var(--font-sans); color: var(--text-secondary);
}
.pds-mega__group i { width: 18px; text-align: center; color: var(--text-muted); font-size: 13px; }
.pds-mega__group:hover, .pds-mega__group[aria-selected="true"] { background: var(--surface-soft); color: var(--text-primary); }
.pds-mega__group[aria-selected="true"] { font-weight: 600; }
.pds-mega__group[aria-selected="true"] i { color: var(--portexa-primary-ink); }
.pds-mega__group .pds-badge { margin-left: auto; height: 18px; font-size: 10px; }
.pds-mega__panel[hidden] { display: none; }
.pds-mega__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; margin-bottom: 18px; }
.pds-mega__head p { margin: 4px 0 0; max-width: 620px; font-size: 14px; color: var(--text-muted); }
.pds-mega__cols { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px 28px; }
.pds-mega__section h4 {
    margin: 0 0 6px; padding: 0 10px;
    font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted);
}
.pds-mega__link {
    display: flex; align-items: center; gap: 9px;
    padding: 7px 10px; border-radius: var(--radius-sm);
    font-size: 14px; color: var(--text-secondary); text-decoration: none;
}
.pds-mega__link i { width: 16px; text-align: center; font-size: 12px; color: var(--text-muted); }
.pds-mega__link:hover { background: var(--surface-soft); color: var(--text-primary); }
.pds-mega__link:hover i { color: var(--portexa-primary-ink); }

/* The mobile drawer. */
.pds-drawer {
    position: fixed; inset: 0; z-index: 70;
    display: flex; justify-content: flex-end;
    background: rgba(15, 23, 42, 0.45);
}
.pds-drawer[hidden] { display: none; }
.pds-drawer__panel {
    display: flex; flex-direction: column;
    width: min(400px, 100%); height: 100%;
    background: var(--surface); border-left: 1px solid var(--border);
    overflow-y: auto; overscroll-behavior: contain;
}
.pds-drawer__head {
    display: flex; align-items: center; justify-content: space-between;
    height: 64px; padding: 0 20px; border-bottom: 1px solid var(--border); flex-shrink: 0;
}
.pds-drawer__body { padding: 8px 20px 24px; flex: 1 1 auto; }
.pds-drawer details { border-bottom: 1px solid var(--border); }
.pds-drawer summary {
    display: flex; align-items: center; justify-content: space-between;
    padding: 16px 0; list-style: none; cursor: pointer;
    font-size: 16px; font-weight: 600; color: var(--text-primary);
}
.pds-drawer summary::-webkit-details-marker { display: none; }
.pds-drawer summary i { font-size: 12px; color: var(--text-muted); transition: transform var(--pds-ease); }
.pds-drawer details[open] > summary i { transform: rotate(180deg); }
.pds-drawer__group { padding: 0 0 12px; }
.pds-drawer__group h4 {
    margin: 12px 0 4px; font-size: 11px; font-weight: 600; letter-spacing: 0.08em;
    text-transform: uppercase; color: var(--text-muted);
}
.pds-drawer__link {
    display: flex; align-items: center; gap: 10px; min-height: 44px;
    padding: 6px 0; font-size: 15px; color: var(--text-secondary); text-decoration: none;
}
.pds-drawer__link i { width: 18px; text-align: center; color: var(--text-muted); font-size: 13px; }
.pds-drawer__plain {
    display: flex; align-items: center; min-height: 56px; border-bottom: 1px solid var(--border);
    font-size: 16px; font-weight: 600; color: var(--text-primary); text-decoration: none;
}
.pds-drawer__theme {
    width: 100%; justify-content: space-between; border: 0; border-bottom: 1px solid var(--border);
    background: transparent; font-family: var(--font-sans); cursor: pointer;
}
.pds-drawer__theme-now { font-weight: 500; color: var(--text-muted); }
.pds-drawer__actions { display: grid; gap: 10px; padding: 20px; border-top: 1px solid var(--border); }
.pds-drawer__actions .pds-btn { width: 100%; }
body.pds-locked { overflow: hidden; }

/* ==========================================================================
   Sections
   ========================================================================== */

.pds-section { padding: var(--pds-section-space) 0; }
.pds-section--soft { background: var(--surface-soft); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.pds-section--tight { padding: 72px 0; }
.pds-center { text-align: center; }
.pds-intro { max-width: 760px; margin: 0 auto; }
.pds-intro .pds-lead { margin-left: auto; margin-right: auto; max-width: 700px; }

/* Hero. */
.pds-hero {
    padding: var(--pds-section-space) 0;
    background: linear-gradient(180deg, var(--surface), var(--portexa-primary-soft));
    border-bottom: 1px solid var(--border);
}
.pds-hero__grid { display: grid; grid-template-columns: minmax(0, 46fr) minmax(0, 54fr); gap: var(--pds-content-gap); align-items: center; }
.pds-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.pds-hero__note { margin: 18px 0 0; font-size: var(--public-type-meta); color: var(--text-muted); }
.pds-hero__trust { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 28px; font-size: var(--public-type-caption); color: var(--text-muted); }
.pds-hero__trust span { display: inline-flex; align-items: center; gap: 6px; }
.pds-hero__trust i { color: var(--positive); font-size: 12px; }
.pds-hero__entry {
    display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px;
    margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border-strong);
    font-size: 14px; color: var(--text-secondary);
}
.pds-hero__entry > span { font-weight: 600; }
.pds-hero__entry .pds-link { min-height: 44px; }
.pds-hero__entry .pds-link:last-child { margin-left: auto; }

/* Feature pills. */
.pds-pills {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 12px;
    padding: 4px 2px 8px; margin: 0; list-style: none;
    scrollbar-width: thin;
}
.pds-pill {
    display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0;
    height: 40px; padding: 0 16px;
    border: 1px solid var(--border); border-radius: 999px; background: var(--surface);
    font-size: var(--public-type-meta); font-weight: 500; color: var(--text-secondary); text-decoration: none; white-space: nowrap;
    transition: border-color var(--pds-ease), color var(--pds-ease);
}
a.pds-pill:hover { border-color: var(--border-strong); color: var(--text-primary); }
.pds-pill i { font-size: 12px; color: var(--portexa-primary-ink); }

/* Cards. */
.pds-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 20px;
    transition: border-color var(--pds-ease), box-shadow var(--pds-ease);
}
.pds-card--lg { padding: 24px; }
a.pds-card { display: block; color: inherit; text-decoration: none; }
a.pds-card:hover, .pds-card--hover:hover { border-color: var(--border-strong); box-shadow: var(--pds-shadow-sm); }
.pds-card__icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: var(--radius-md);
    background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); font-size: 16px;
}
.pds-card__meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.pds-landing .pds-card--lg { display: flex; flex-direction: column; align-items: flex-start; }
.pds-landing .pds-card--lg .pds-card__icon { flex-shrink: 0; }
.pds-landing .pds-card--lg .pds-card__meta { margin-top: auto; padding-top: 20px; }
.pds-grid { display: grid; gap: 20px; }
.pds-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pds-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pds-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Metric cards. */
.pds-metric {
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md);
    padding: 16px 18px; min-width: 0;
}
.pds-metric__label { display: block; font-size: 12px; font-weight: 500; color: var(--text-muted); }
.pds-metric__value {
    display: block; margin-top: 6px;
    font-size: 24px; font-weight: 700; line-height: 1.15; color: var(--text-primary);
    font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pds-metric__change {
    display: inline-flex; align-items: center; gap: 4px; margin-top: 6px;
    font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums;
}
.pds-metric__change i { font-size: 10px; }
.pds-metric__note { margin-left: 4px; font-weight: 400; color: var(--text-muted); }
.pds-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }

/* Financial tables. */
.pds-table-wrap {
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface);
}
.pds-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.pds-table caption { caption-side: top; text-align: left; padding: 14px 16px 10px; font-size: 13px; font-weight: 600; color: var(--text-secondary); }
.pds-table th {
    height: 40px; padding: 0 16px;
    background: var(--surface-soft);
    font-size: 12px; font-weight: 600; letter-spacing: 0.03em; text-transform: uppercase;
    color: var(--text-body); text-align: left; white-space: nowrap;
    border-bottom: 1px solid var(--border);
}
.pds-table td {
    height: 50px; padding: 0 16px;
    border-bottom: 1px solid var(--border-row);
    color: var(--text-secondary); white-space: nowrap;
}
.pds-table tbody tr:last-child td { border-bottom: 0; }
.pds-table tbody tr:hover { background: var(--surface-soft); }
.pds-table .is-num { text-align: right; font-variant-numeric: tabular-nums; }
.pds-table .is-key { font-weight: 600; color: var(--text-primary); }
.pds-table--compact th { height: 34px; }
.pds-table--compact td { height: 40px; font-size: 13px; }

/* Signed change: an arrow and a sign, never colour alone. */
.pds-chg { display: inline-flex; align-items: center; gap: 4px; font-variant-numeric: tabular-nums; font-weight: 600; }
.pds-chg i { font-size: 9px; }

/* ==========================================================================
   The product preview (an HTML mock of the terminal)
   ========================================================================== */

.pds-mock {
    margin: 0;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--pds-shadow-frame);
    overflow: hidden;
    font-size: 12px;
    color: var(--text-secondary);
}
.pds-mock__top {
    display: flex; align-items: center; gap: 12px;
    height: 46px; padding: 0 14px;
    border-bottom: 1px solid var(--border); background: var(--surface);
}
.pds-mock__brand { display: inline-flex; align-items: center; gap: 7px; font-weight: 700; font-size: 13px; color: var(--text-primary); }
.pds-mock__brand .pds-logo__mark { height: 18px; }
.pds-mock__search {
    display: flex; align-items: center; gap: 8px; flex: 1 1 auto; max-width: 280px;
    height: 28px; padding: 0 10px; border: 1px solid var(--border); border-radius: var(--radius-sm);
    background: var(--surface-soft); color: var(--text-muted); font-size: 11.5px;
}
.pds-mock__status { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; color: var(--text-muted); white-space: nowrap; }
.pds-mock__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--text-muted); }
.pds-mock__dot.is-open { background: var(--positive); }
.pds-mock__body { display: grid; grid-template-columns: 132px minmax(0, 1fr); }
.pds-mock__side { padding: 10px 8px; border-right: 1px solid var(--border); background: var(--surface-soft); }
.pds-mock__nav {
    display: flex; align-items: center; gap: 8px;
    padding: 6px 8px; border-radius: var(--radius-sm);
    font-size: 11.5px; font-weight: 500; color: var(--text-muted);
}
.pds-mock__nav i { width: 13px; text-align: center; font-size: 10.5px; }
.pds-mock__nav.is-active { background: var(--surface); color: var(--text-primary); font-weight: 600; box-shadow: var(--pds-shadow-sm); }
.pds-mock__nav.is-active i { color: var(--portexa-primary-ink); }
.pds-mock__main { padding: 14px; min-width: 0; display: grid; gap: 12px; }
.pds-mock__index { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.pds-mock__label { font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); }
.pds-mock__value { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; color: var(--text-primary); font-variant-numeric: tabular-nums; line-height: 1.1; }
.pds-mock__chg { font-size: 13px; }
.pds-mock__asof { font-size: 10.5px; color: var(--text-muted); text-align: right; }
.pds-mock__chart { position: relative; border: 1px solid var(--border-row); border-radius: var(--radius-md); padding: 6px 6px 2px; background: var(--surface); }
.pds-mock__chart svg { display: block; width: 100%; height: 104px; }
.pds-mock__chart .line { fill: none; stroke: var(--portexa-primary-ink); stroke-width: 2; vector-effect: non-scaling-stroke; }
.pds-mock__chart .area { fill: var(--portexa-primary-soft); opacity: 0.9; }
.pds-mock__chart .grid { stroke: var(--border-row); stroke-width: 1; vector-effect: non-scaling-stroke; }
.pds-mock__kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.pds-mock__kpi { border: 1px solid var(--border-row); border-radius: var(--radius-sm); padding: 8px 9px; min-width: 0; }
.pds-mock__kpi span { display: block; font-size: 10px; color: var(--text-muted); }
.pds-mock__kpi b { display: block; margin-top: 3px; font-size: 13.5px; font-weight: 700; color: var(--text-primary); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pds-mock__breadth { display: flex; height: 5px; border-radius: 999px; overflow: hidden; margin-top: 5px; background: var(--border-row); }
.pds-mock__breadth .adv { background: var(--positive); }
.pds-mock__breadth .dec { background: var(--negative); }
.pds-mock__panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.pds-mock__panel { border: 1px solid var(--border-row); border-radius: var(--radius-sm); padding: 8px 9px; min-width: 0; }
.pds-mock__panel h5 { margin: 0 0 6px; font-size: 10px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); }
.pds-mock__row { display: flex; justify-content: space-between; gap: 6px; padding: 3px 0; font-size: 11px; font-variant-numeric: tabular-nums; }
.pds-mock__row span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-secondary); }
.pds-mock__row b { font-weight: 600; color: var(--text-primary); white-space: nowrap; }
.pds-mock__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pds-mock__chip { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 8px; border: 1px solid var(--border-row); border-radius: 999px; font-size: 11px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pds-mock__chip b { color: var(--text-primary); }
.pds-mock__foot { display: flex; justify-content: space-between; gap: 8px; padding: 8px 14px; border-top: 1px solid var(--border); font-size: 10.5px; color: var(--text-muted); background: var(--surface-soft); }

/* ==========================================================================
   Product sections (alternating text + preview)
   ========================================================================== */

.pds-product { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--pds-content-gap); align-items: center; }
.pds-product + .pds-product { margin-top: var(--pds-section-space); padding-top: var(--pds-section-space); border-top: 1px solid var(--border); }
.pds-product--flip .pds-product__text { order: 2; }
.pds-product--flip .pds-product__preview { order: 1; }
.pds-product__text .pds-lead { font-size: 17px; }
.pds-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; margin: 28px 0 0; padding: 0; list-style: none; }
.pds-checks li { display: flex; align-items: flex-start; gap: 10px; font-size: 15px; color: var(--text-secondary); }
.pds-checks i { margin-top: 4px; font-size: 12px; color: var(--portexa-primary-ink); }
.pds-product__cta { margin-top: 28px; }
.pds-preview {
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg);
    box-shadow: var(--pds-shadow-frame); overflow: hidden;
}
.pds-preview__bar {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 12px 16px; border-bottom: 1px solid var(--border); background: var(--surface-soft);
}
.pds-preview__title { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-width: 0; font-size: 14px; font-weight: 600; color: var(--text-primary); }
.pds-preview__title small { font-weight: 500; color: var(--text-muted); }
.pds-preview__body { padding: 16px; display: grid; gap: 14px; }
.pds-preview__caption { padding: 0 16px 14px; font-size: 12px; color: var(--text-muted); }

/* Bars used in previews (allocation, concentration, fair-value range). */
.pds-stack { display: flex; height: 10px; border-radius: 999px; overflow: hidden; background: var(--border-row); }
.pds-stack span { display: block; height: 100%; }
.pds-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 10px; font-size: 12.5px; color: var(--text-secondary); }
.pds-legend span { display: inline-flex; align-items: center; gap: 6px; }
.pds-legend i { width: 9px; height: 9px; border-radius: 2px; display: inline-block; }
.pds-range { position: relative; height: 44px; margin: 6px 4px 0; }
.pds-range__track { position: absolute; left: 0; right: 0; top: 18px; height: 8px; border-radius: 999px; background: var(--border-row); }
.pds-range__band { position: absolute; top: 18px; height: 8px; border-radius: 999px; background: var(--portexa-primary-soft); border: 1px solid var(--portexa-primary-ink); }
.pds-range__mark { position: absolute; top: 8px; width: 2px; height: 28px; background: var(--text-primary); }
.pds-range__mark span { position: absolute; top: -6px; left: 6px; font-size: 11px; font-weight: 600; white-space: nowrap; color: var(--text-primary); }
.pds-range__ends { display: flex; justify-content: space-between; font-size: 12px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.pds-tech svg { display: block; width: 100%; height: auto; }
.pds-tech .candle-up { fill: var(--positive); stroke: var(--positive); }
.pds-tech .candle-down { fill: var(--negative); stroke: var(--negative); }
.pds-tech .wick { stroke-width: 1; }
.pds-tech .ma-fast { fill: none; stroke: var(--portexa-primary-ink); stroke-width: 1.6; }
.pds-tech .ma-slow { fill: none; stroke: var(--warning); stroke-width: 1.6; }
.pds-tech .level { stroke: var(--text-muted); stroke-width: 1; stroke-dasharray: 4 4; }
.pds-tech .level-label { font-size: 10px; fill: var(--text-muted); font-family: var(--font-sans); }
.pds-tech .vol { fill: var(--border-strong); }
.pds-tech .rsi { fill: none; stroke: var(--portexa-primary-ink); stroke-width: 1.4; }
.pds-tech .rsi-band { fill: var(--surface-soft); }
.pds-tech .axis { stroke: var(--border-row); }

/* ==========================================================================
   Screenshots (light / dark, from static/website/screenshots/)
   ========================================================================== */

.pds-shot {
    margin: 0;
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg);
    box-shadow: var(--pds-shadow-frame); overflow: hidden;
}
.pds-shot__bar {
    display: flex; align-items: center; gap: 12px;
    height: 44px; padding: 0 14px; border-bottom: 1px solid var(--border); background: var(--surface-soft);
}
.pds-shot__dots { display: inline-flex; gap: 6px; }
.pds-shot__dots i { width: 10px; height: 10px; border-radius: 50%; background: var(--border-strong); display: block; }
.pds-shot__url {
    flex: 1 1 auto; min-width: 0; height: 26px; padding: 0 10px; border-radius: var(--radius-sm);
    display: flex; align-items: center; gap: 6px;
    background: var(--surface); border: 1px solid var(--border);
    font-size: 12px; color: var(--text-muted); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.pds-seg { display: inline-flex; padding: 2px; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); }
.pds-seg button {
    height: 26px; padding: 0 10px; border: 0; border-radius: var(--radius-sm);
    background: transparent; font: 500 12px/1 var(--font-sans); color: var(--text-muted); cursor: pointer;
}
.pds-seg button[aria-pressed="true"] { background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); font-weight: 600; }
.pds-shot__view { position: relative; background: var(--surface-soft); aspect-ratio: 16 / 10; }
.pds-shot__img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.pds-shot__img--dark { display: none; }
html.dark .pds-shot[data-view="auto"] .pds-shot__img--light { display: none; }
html.dark .pds-shot[data-view="auto"] .pds-shot__img--dark { display: block; }
.pds-shot[data-view="light"] .pds-shot__img--light { display: block; }
.pds-shot[data-view="light"] .pds-shot__img--dark { display: none; }
.pds-shot[data-view="dark"] .pds-shot__img--light { display: none; }
.pds-shot[data-view="dark"] .pds-shot__img--dark { display: block; }
.pds-shot figcaption {
    display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px;
    padding: 10px 14px; border-top: 1px solid var(--border); font-size: var(--public-type-caption); color: var(--text-muted);
}
.pds-shot__when { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pds-shot__empty {
    position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
    padding: 24px; text-align: center; color: var(--text-muted);
}
.pds-shot__empty .pds-card__icon { width: 56px; height: 56px; font-size: 22px; }
.pds-shot__empty b { font-size: 16px; color: var(--text-primary); }
.pds-thumb { position: relative; aspect-ratio: 16 / 10; overflow: hidden; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface-soft); }
.pds-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.pds-thumb .pds-shot__img--dark { display: none; }
html.dark .pds-thumb .pds-shot__img--light { display: none; }
html.dark .pds-thumb .pds-shot__img--dark { display: block; }
.pds-thumb__empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--text-muted); font-size: 26px; }

/* ==========================================================================
   Capability pages
   ========================================================================== */

/* Homepage totals use the shared type and colour tokens in both themes. */
.pds-statistics { padding: var(--pds-content-gap) 0; }
.pds-statistics [data-pds-stat-tile][hidden], .pds-statistics [data-pds-stat-group][hidden] { display: none !important; }
.pds-statistics__heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.pds-statistics__heading h2, .pds-statistics__heading p { margin: 0; }
.pds-statistics__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface-soft); overflow: hidden; }
.pds-statistics__card { min-width: 0; padding: var(--space-5) var(--space-6); }
.pds-statistics__card + .pds-statistics__card { border-left: 1px solid var(--border); }
.pds-statistics__card dt { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-base); font-weight: var(--font-weight-medium); color: var(--text-secondary); }
.pds-statistics__card dt i { color: var(--portexa-primary-ink); }
.pds-statistics__number { margin: var(--space-2) 0; font-size: var(--font-3xl); font-weight: var(--font-weight-bold); line-height: var(--leading-tight); font-variant-numeric: tabular-nums; color: var(--text-primary); }
.pds-statistics__description { margin: 0; font-size: var(--font-sm); color: var(--text-muted); }
.pds-statistics__coverage { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: var(--space-4) 0 0; gap: var(--space-4); }
.pds-statistics__coverage > div { min-width: 0; padding: var(--space-4); border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.pds-statistics__coverage dt { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-sm); color: var(--text-secondary); }
.pds-statistics__coverage dt i { color: var(--portexa-primary-ink); }
.pds-statistics__coverage dd[data-pds-statistic] { margin: var(--space-2) 0 var(--space-1); font-size: var(--font-2xl); font-weight: var(--font-weight-bold); line-height: var(--leading-tight); font-variant-numeric: tabular-nums; }
.pds-statistics__group { margin-top: var(--space-6); padding-top: var(--space-6); border-top: 1px solid var(--border); }
.pds-statistics__group h3 { margin: 0; font-size: var(--font-base); font-weight: var(--font-weight-semibold); color: var(--text-secondary); }
.pds-statistics__group .pds-link { font-size: var(--font-sm); }
.pds-statistics__group .pds-statistics__coverage { margin-top: 0; }
.pds-statistics__toolkit { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-6); margin-top: var(--space-4); padding: var(--space-4); border-radius: var(--radius-md); background: var(--portexa-primary-soft); }
.pds-statistics__toolkit h3 { margin: 0; font-size: var(--font-sm); font-weight: var(--font-weight-semibold); color: var(--text-secondary); }
.pds-statistics__toolkit dl { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); margin: 0; }
.pds-statistics__toolkit dl > div { display: flex; align-items: baseline; gap: var(--space-2); }
.pds-statistics__toolkit dt { font-size: var(--font-sm); color: var(--text-secondary); }
.pds-statistics__toolkit dd { order: -1; margin: 0; font-size: var(--font-lg); font-weight: var(--font-weight-bold); font-variant-numeric: tabular-nums; color: var(--portexa-primary-ink); }
.pds-statistics__note { margin-top: var(--space-3); font-size: var(--font-sm); color: var(--text-muted); }
.pds-statistics__note summary { width: fit-content; cursor: pointer; }
.pds-statistics__note summary:focus-visible { outline: 2px solid var(--portexa-primary-ink); outline-offset: 4px; border-radius: var(--radius-sm); }
.pds-statistics__note p { max-width: 80ch; margin: var(--space-2) 0 0; }

.pds-page-header {
    position: sticky; top: var(--pds-header-h); z-index: 40;
    padding: var(--space-3) 0;
    background: var(--surface-soft); border-bottom: 1px solid var(--border);
}
.pds-page-title {
    margin: 0; overflow-wrap: anywhere;
    font-size: var(--public-type-page-title);
    font-weight: var(--font-weight-bold); line-height: var(--leading-tight);
    letter-spacing: -.015em; color: var(--text-primary);
}
.pds-page-subtitle {
    margin: 4px 0 0; max-width: 72rem;
    font-size: var(--public-type-meta); line-height: 1.45; color: var(--text-muted);
}
.pds-page-intro { padding-top: var(--space-4); }
.pds-page-intro .pds-crumbs { margin-bottom: 0; }
.pds-page-intro + .pds-section { padding-top: var(--space-5); }
.pds-crumbs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 20px; padding: 0; list-style: none; font-size: var(--public-type-caption); color: var(--text-muted); }
.pds-crumbs a { color: var(--text-muted); text-decoration: none; }
.pds-crumbs a:hover { color: var(--text-primary); text-decoration: underline; }
.pds-crumbs li + li::before { content: '/'; margin-right: 6px; color: var(--border-strong); }
.pds-cap-section + .pds-cap-section { margin-top: 56px; }
.pds-cap-section__head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 18px; }
.pds-item-card { display: flex; flex-direction: column; gap: 14px; height: 100%; }
.pds-item-card__name { display: flex; align-items: center; gap: 8px; font-size: var(--public-type-item); font-weight: 600; color: var(--text-primary); }
.pds-item-card__name i { font-size: 13px; color: var(--portexa-primary-ink); }
.pds-item-card p { margin: 0; font-size: var(--public-type-meta); line-height: 1.5; color: var(--text-muted); }
.pds-item { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: start; }
.pds-item__aside { position: sticky; top: calc(var(--pds-heading-offset, var(--pds-header-h)) + 24px); display: grid; gap: 16px; }
.pds-points { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.pds-points li { display: flex; gap: 10px; font-size: var(--public-type-card-text); color: var(--text-secondary); }
.pds-points i { margin-top: 5px; font-size: 12px; color: var(--portexa-primary-ink); }
.pds-access { display: grid; gap: 10px; }
.pds-access .pds-btn { width: 100%; white-space: normal; text-align: center; line-height: 1.35; }
.pds-pager { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 40px; }
.pds-pager a { display: block; padding: 16px 18px; border: 1px solid var(--border); border-radius: var(--radius-md); text-decoration: none; color: var(--text-primary); }
.pds-pager a:hover { border-color: var(--border-strong); }
.pds-pager small { display: block; font-size: var(--public-type-label); color: var(--text-muted); margin-bottom: 4px; }
.pds-pager .is-next { text-align: right; }

/* ==========================================================================
   Blog + legal (prose)
   ========================================================================== */

.pds-post-card { display: flex; flex-direction: column; gap: 10px; height: 100%; }
.pds-post-card h3 { margin: 0; font-size: var(--public-type-card); line-height: 1.35; }
.pds-post-card p { margin: 0; font-size: var(--public-type-card-text); color: var(--text-muted); }
.pds-post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; font-size: var(--public-type-caption); color: var(--text-muted); }
ul.pds-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 32px; padding: 0; list-style: none; }
ul.pds-filter a {
    display: inline-flex; align-items: center; height: 36px; padding: 0 14px;
    border: 1px solid var(--border); border-radius: 999px; font-size: 14px; color: var(--text-secondary); text-decoration: none;
}
ul.pds-filter a[aria-current="page"] { background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); border-color: transparent; font-weight: 600; }
.pds-article { display: grid; grid-template-columns: minmax(0, 720px) 300px; gap: 64px; justify-content: space-between; }
.pds-prose { font-size: var(--public-type-prose); line-height: 1.7; color: var(--text-secondary); }
.pds-prose h2 { margin: 44px 0 12px; font-size: var(--public-type-block); font-weight: 700; line-height: 1.3; color: var(--text-primary); letter-spacing: -0.01em; }
.pds-prose h3 { margin: 32px 0 10px; font-size: var(--public-type-card); font-weight: 700; color: var(--text-primary); }
.pds-prose p { margin: 0 0 18px; }
.pds-prose ul, .pds-prose ol { margin: 0 0 18px; padding-left: 22px; }
.pds-prose li { margin: 6px 0; }
.pds-prose strong { color: var(--text-primary); }
.pds-prose a { color: var(--portexa-primary-ink); text-underline-offset: 3px; }
.pds-prose .pds-table-wrap { margin: 8px 0 24px; }
.pds-prose .pds-table { font-size: var(--public-type-card-text); }
.pds-note {
    margin: 0 0 22px; padding: 14px 16px; border-left: 3px solid var(--portexa-primary-ink);
    background: var(--portexa-primary-soft); border-radius: 0 var(--radius-md) var(--radius-md) 0;
    font-size: var(--public-type-card-text); color: var(--text-secondary);
}
.pds-formula {
    margin: 0 0 20px; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--radius-md);
    background: var(--surface-soft); font-size: var(--public-type-card-text); font-variant-numeric: tabular-nums; color: var(--text-primary);
}
.pds-toc { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; font-size: var(--public-type-meta); }
.pds-toc a { display: block; padding: 6px 10px; border-radius: var(--radius-sm); color: var(--text-secondary); text-decoration: none; }
.pds-toc a:hover, .pds-toc a[aria-current="page"] { background: var(--surface-soft); color: var(--text-primary); }
.pds-toc a[aria-current="page"] { font-weight: 600; }

/* ==========================================================================
   CTA band + footer
   ========================================================================== */

.pds-cta {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: center;
    padding: 40px; border: 1px solid var(--border); border-radius: var(--radius-xl);
    background: linear-gradient(135deg, var(--portexa-primary-soft), var(--surface));
}
.pds-cta p { margin: 10px 0 0; max-width: 620px; color: var(--text-body); }
.pds-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; }

.pds-footer {
    background: var(--surface-soft);
    border-top: 1px solid var(--border);
    color: var(--text-secondary);
    font-size: var(--public-type-meta);
}
.pds-footer__top { display: grid; grid-template-columns: 1.4fr repeat(4, minmax(0, 1fr)); gap: 40px; padding: 64px 0 48px; }
.pds-footer__brand p { margin: 16px 0 0; max-width: 320px; line-height: 1.6; color: var(--text-muted); }
.pds-footer__contact { display: grid; gap: 8px; margin: 20px 0 0; padding: 0; list-style: none; }
.pds-footer__contact li { display: flex; align-items: flex-start; gap: 10px; color: var(--text-muted); }
.pds-footer__contact a, .pds-footer__contact span { min-width: 0; overflow-wrap: anywhere; }
.pds-footer__contact i { width: 14px; margin-top: 3px; text-align: center; font-size: 12px; color: var(--text-muted); }
.pds-footer__contact a { color: var(--text-secondary); text-decoration: none; }
.pds-footer__contact a:hover { color: var(--text-primary); text-decoration: underline; }
.pds-footer h2 {
    margin: 0 0 14px; font-size: var(--public-type-label); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-primary);
}
.pds-footer ul.pds-footer__links { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.pds-footer__links a { display: inline-flex; align-items: center; gap: 6px; color: var(--text-muted); text-decoration: none; }
.pds-footer__links a:hover { color: var(--text-primary); text-decoration: underline; text-underline-offset: 3px; }
.pds-footer__links .pds-badge { height: 18px; font-size: 10px; }
.pds-footer__disclaimer {
    padding: 20px 0; border-top: 1px solid var(--border);
    font-size: var(--public-type-caption); line-height: 1.6; color: var(--text-muted);
}
.pds-footer__bottom {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px;
    padding: 18px 0 28px; border-top: 1px solid var(--border); font-size: var(--public-type-caption); color: var(--text-muted);
}
.pds-footer__legal { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0; padding: 0; list-style: none; }
.pds-footer__legal a { color: var(--text-muted); text-decoration: none; }
.pds-footer__legal a:hover { color: var(--text-primary); text-decoration: underline; }

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (min-width: 1440px) {
    .pds { --pds-gutter: 40px; }
}

@media (min-width: 1601px) {
    .pds-header__inner { max-width: 1440px; }
}

@media (max-width: 1600px) {
    .pds-nav__link { padding: 0 8px; font-size: var(--font-base); }
    .pds-header__inner { gap: var(--space-4); }
    .pds-actions .pds-hide-lg { display: none; }
}

@media (max-width: 1240px) {
    .pds-nav, .pds-actions .pds-btn, .pds-actions .pds-hide-md { display: none; }
    .pds .pds-burger { display: inline-flex; }
    .pds-footer__top { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .pds-footer__brand { grid-column: 1 / -1; }
}

@media (min-width: 768px) and (max-width: 1240px) {
    .pds-actions .pds-btn--secondary { display: inline-flex; }
}

@media (max-width: 1023px) {
    .pds { --pds-gutter: 24px; }
    .pds-hero { padding: 72px 0 56px; }
    .pds-hero__grid { grid-template-columns: 1fr; gap: 48px; }
    .pds-h1 { max-width: 640px; }
    .pds-product, .pds-product--flip { grid-template-columns: 1fr; gap: 36px; }
    .pds-product--flip .pds-product__text, .pds-product--flip .pds-product__preview { order: 0; }
    .pds-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pds-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pds-item { grid-template-columns: 1fr; }
    .pds-item__aside { position: static; }
    .pds-article { grid-template-columns: 1fr; gap: 40px; }
    .pds-page-header { padding: var(--space-2) 0; }
    .pds-page-subtitle { font-size: var(--font-sm); line-height: 1.4; }
    .pds-cta { grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
    .pds { --pds-gutter: 20px; --pds-header-h: 64px; }
    .pds-pills { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; }
    .pds-section--tight { padding: 48px 0; }
    .pds-hero { padding: 48px 0 40px; }
    .pds-h1 { line-height: 1.08; }
    .pds-statistics__grid { grid-template-columns: 1fr; }
    .pds-statistics__card { padding: var(--space-4); display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: var(--space-3); }
    .pds-statistics__card + .pds-statistics__card { border-left: 0; border-top: 1px solid var(--border); }
    .pds-statistics__number { grid-column: 2; grid-row: 1 / 3; margin: 0; font-size: var(--font-2xl); }
    .pds-statistics__description { grid-column: 1; margin-top: var(--space-1); }
    .pds-statistics__coverage { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
    .pds-statistics__coverage > div { padding: var(--space-3); display: flex; flex-direction: column; }
    .pds-statistics__coverage dd[data-pds-statistic] { margin-top: auto; padding-top: var(--space-2); }
    .pds-statistics__coverage dt { display: block; line-height: var(--leading-tight); }
    .pds-statistics__coverage dt i { display: none; }
    .pds-statistics__coverage .pds-statistics__description { margin-top: 4px; line-height: 1.4; }
    .pds-statistics__toolkit { align-items: flex-start; gap: var(--space-2); }
    .pds-statistics__toolkit h3 { flex-basis: 100%; }
    .pds-hero__ctas { flex-direction: column; }
    .pds-hero__ctas .pds-btn, .pds-cta__actions .pds-btn { width: 100%; }
    .pds-cta__actions { width: 100%; }
    .pds-hero__entry { gap: 4px 16px; }
    .pds-hero__entry > span { flex-basis: 100%; }
    .pds-hero__entry .pds-link:last-child { margin-left: 0; }
    .pds-logo__tag { display: none; }
    .pds-logo__mark { height: 30px; }
    .pds-logo__name { height: 22px; }
    .pds-mock__body { grid-template-columns: 1fr; }
    .pds-mock__side { display: none; }
    .pds-mock__search { display: none; }
    .pds-mock__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pds-mock__panels { grid-template-columns: 1fr; }
    .pds-mock__foot { flex-direction: column; gap: 2px; }
    .pds-checks { grid-template-columns: 1fr; }
    .pds-grid--2, .pds-grid--3, .pds-grid--4 { grid-template-columns: 1fr; }
    .pds-footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px; padding: 48px 0 32px; }
    .pds-cta { padding: 28px 22px; }
    .pds-pager { grid-template-columns: 1fr; }
    .pds-shot__url { display: none; }
    .pds-cap-section__head { flex-direction: column; align-items: flex-start; gap: 6px; }
    .pds-mega__cols { grid-template-columns: 1fr; }
}

@media (max-width: 380px) {
    .pds-footer__top { grid-template-columns: 1fr; }
    .pds-mock__kpis { grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .pds *, .pds *::before, .pds *::after { transition: none !important; scroll-behavior: auto !important; }
}

/* ==========================================================================
   Inside the app shell (base.html) — visitors only
   ========================================================================== */

/* base.html marks visitor pages `html.px-public`: no sidebar, this header
   fixed at the top, the page heading under it. */
html.px-public .content-area { margin-left: 0 !important; max-width: 100% !important; }
html.px-public .footer-wrapper { margin-left: 0 !important; width: 100% !important; }
html.px-public .page-header-sticky { top: 72px; left: 0 !important; }
html.px-public main.main-scrollable { padding-top: calc(72px + var(--page-header-height, 5.5rem)); }
@media (min-width: 1280px) {
    html.px-public main.main-scrollable > .w-full { max-width: 1280px; margin: 0 auto; }
    html.px-public .page-header-sticky {
        padding-left: max(1.5rem, calc((100vw - 1280px) / 2 + 32px));
        padding-right: max(1.5rem, calc((100vw - 1280px) / 2 + 32px));
    }
}
/* On the content-page layer the column is 1200 px wide: the heading lines up
   with it, as the website's own heading lines up with its container. */
@media (min-width: 1280px) {
    html.px-public:has(.pds-page) .page-header-sticky {
        padding-left: max(1.5rem, calc((100vw - 1200px) / 2));
        padding-right: max(1.5rem, calc((100vw - 1200px) / 2));
    }
}
@media (max-width: 767px) {
    html.px-public .page-header-sticky { top: 64px; }
    html.px-public main.main-scrollable { padding-top: calc(64px + var(--page-header-height, 5.5rem)); }
}
/* A visitor reads these pages as part of the website, so the heading is the
   website's (website/_base_content.html, .pds-page-header): the public
   type scale, the soft band, no brand line (that belongs to the terminal),
   and heading buttons in the site's button shape. Members keep the app's
   heading. Pages on the content-page layer (.pds-page) also take the
   website's page colour; the analysis-style pages a visitor may open
   (training, calculators, corporate actions) keep theirs. */
html.px-public .page-header-sticky {
    padding-top: var(--space-3); padding-bottom: var(--space-3);
    background: var(--public-surface-soft); border-bottom-color: var(--public-border);
}
html.px-public .page-header-sticky .brand-tagline { display: none; }
html.px-public .page-header-sticky .shell-title {
    font-size: var(--public-type-page-title); font-weight: var(--font-weight-bold);
    letter-spacing: -.015em; color: var(--public-text-primary);
}
html.px-public .page-header-sticky .shell-subtitle {
    margin-top: 4px; font-size: var(--public-type-meta); line-height: 1.45; color: var(--public-text-muted);
}
html.px-public .page-header-sticky .shell-btn {
    height: 40px; padding: 0 16px; border-color: var(--public-border-strong); border-radius: var(--radius-md);
    background: var(--public-surface); box-shadow: none;
    font-size: var(--public-type-meta); color: var(--public-text-primary);
}
html.px-public .page-header-sticky .shell-btn:hover { background: var(--public-surface-soft); border-color: var(--public-text-muted); }
html.px-public:has(.pds-page), html.px-public:has(.pds-page) body { background: var(--public-bg); }
@media (max-width: 1023px) {
    html.px-public .page-header-sticky { padding-top: var(--space-2); padding-bottom: var(--space-2); }
    html.px-public .page-header-sticky .shell-subtitle { font-size: var(--public-type-caption); }
    html.px-public .page-header-sticky .shell-btn { height: 36px; padding: 0 12px; }
}


/* The cover page's slideshow (components/hero_slider.html) between the
   header and the hero: one band the width of the page, well below the
   pictures' own 3 : 1 (two thirds of the first cut), each picture centred so
   its words stay in view; the slides cross-fade with a slow settle. Each
   slide has a dark-mode and a light-mode picture — the theme shows one
   (hide-only rules). Arrows, dots with the time left, a pause button —
   behaviour in portexa-site.js ([data-pds-slider]). The controls follow the
   theme: light on the dark pictures, navy on the light ones. */
.pds-slider {
    --pds-slide-ms: 5000ms;
    --pds-slider-ink: #FFFFFF;
    --pds-slider-glass: rgba(8, 17, 36, .42);
    --pds-slider-glass-hover: rgba(8, 17, 36, .7);
    --pds-slider-line: rgba(255, 255, 255, .3);
    --pds-slider-dot: rgba(255, 255, 255, .5);
    --pds-slider-floor: rgba(4, 10, 24, .5);
    position: relative; overflow: hidden; isolation: isolate;
    height: clamp(140px, 18vw, 293px);
    background: #0B1D3F;
}
html:not(.dark) .pds-slider {
    --pds-slider-ink: #0B2D5B;
    --pds-slider-glass: rgba(255, 255, 255, .62);
    --pds-slider-glass-hover: rgba(255, 255, 255, .88);
    --pds-slider-line: rgba(11, 45, 91, .22);
    --pds-slider-dot: rgba(11, 45, 91, .35);
    --pds-slider-floor: rgba(255, 255, 255, .55);
    background: #E5EEF5;
}
.pds-slider__track { position: absolute; inset: 0; }
.pds-slide {
    position: absolute; inset: 0; margin: 0;
    opacity: 0; visibility: hidden;
    transition: opacity 900ms ease, visibility 0s linear 900ms;
}
.pds-slide.is-active { opacity: 1; visibility: visible; transition: opacity 900ms ease; z-index: 1; }
.pds-slide__img {
    display: block; width: 100%; height: 100%;
    object-fit: cover; object-position: center;
    transform-origin: 30% 50%;
}
html:not(.dark) .pds-slide__img.is-dark,
html.dark .pds-slide__img.is-light { display: none; }
.pds-slide.is-active .pds-slide__img { animation: pds-slide-settle calc(var(--pds-slide-ms) + 900ms) ease-out both; }
@keyframes pds-slide-settle { from { transform: scale(1.045); } to { transform: scale(1); } }
.pds-slider::after {            /* a soft floor so the dots read on any picture */
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 36%;
    background: linear-gradient(to top, var(--pds-slider-floor), transparent);
    z-index: 2; pointer-events: none;
}
.pds-slider__arrow {
    position: absolute; top: 50%; z-index: 3;
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; margin-top: -19px; border-radius: 999px;
    border: 1px solid var(--pds-slider-line); background: var(--pds-slider-glass);
    color: var(--pds-slider-ink); font-size: 13px; cursor: pointer;
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    opacity: 0; transition: opacity var(--pds-ease), background var(--pds-ease), transform var(--pds-ease);
}
.pds-slider__arrow.is-prev { left: 18px; }
.pds-slider__arrow.is-next { right: 18px; }
.pds-slider:hover .pds-slider__arrow, .pds-slider:focus-within .pds-slider__arrow { opacity: 1; }
.pds-slider__arrow:hover { background: var(--pds-slider-glass-hover); transform: scale(1.06); }
.pds-slider__controls {
    position: absolute; left: 0; right: 0; bottom: 10px; z-index: 3;
    display: flex; align-items: center; justify-content: center; gap: 10px;
}
.pds-slider__dots { display: flex; align-items: center; gap: 7px; }
.pds-slider__dot {
    position: relative; overflow: hidden;
    width: 9px; height: 9px; padding: 0; border: 0; border-radius: 999px;
    background: var(--pds-slider-dot); cursor: pointer;
    transition: width 300ms ease, background var(--pds-ease);
}
.pds-slider__dot:hover { background: var(--pds-slider-ink); }
.pds-slider__dot.is-active { width: 32px; background: var(--pds-slider-dot); }
.pds-slider__dot span { position: absolute; inset: 0; width: 0; border-radius: inherit; background: var(--pds-slider-ink); }
.pds-slider__dot.is-active span { animation: pds-slide-progress var(--pds-slide-ms) linear forwards; }
.pds-slider.is-paused .pds-slider__dot.is-active span,
.pds-slider.is-held .pds-slider__dot.is-active span { animation-play-state: paused; }
@keyframes pds-slide-progress { from { width: 0; } to { width: 100%; } }
.pds-slider__pause {
    display: inline-flex; align-items: center; justify-content: center;
    width: 26px; height: 26px; padding: 0; border-radius: 999px;
    border: 1px solid var(--pds-slider-line); background: var(--pds-slider-glass);
    color: var(--pds-slider-ink); font-size: 9px; cursor: pointer;
}
.pds-slider__pause:hover { background: var(--pds-slider-glass-hover); }
.pds-slider__arrow:focus-visible, .pds-slider__dot:focus-visible, .pds-slider__pause:focus-visible {
    outline: 2px solid var(--pds-slider-ink); outline-offset: 2px; opacity: 1;
}
.pds-slider + .pds-hero { padding-top: 56px; }
@media (max-width: 767px) {
    /* The picture's own shape (about 2.95 : 1), so the whole of it fits
       the width with both messages uncut — and never taller than two thirds
       of the first cut (173 px). */
    .pds-slider { height: min(173px, calc(100vw / 2.95)); min-height: 100px; }
    .pds-slider__arrow { display: none; }            /* swipe and the dots */
    .pds-slider__controls { bottom: 7px; }
    .pds-slider__dot { width: 7px; height: 7px; }
    .pds-slider__dot.is-active { width: 24px; }
    .pds-slider__pause { width: 22px; height: 22px; }
    .pds-slider + .pds-hero { padding-top: 32px; }
}
@media (prefers-reduced-motion: reduce) {
    .pds-slide, .pds-slide.is-active { transition: none; }
    .pds-slide.is-active .pds-slide__img { animation: none; }
}

/* ==========================================================================
   Content pages inside the app shell — About, Services, Contact
   (templates/aboutus.html, services.html, contact.html). They extend
   base.html, so visitors get the public header and members the sidebar; the
   shell's heading carries the page's one <h1>, and this layer gives the page
   body the public site's type and components: 16 px reading text, sentence-
   case controls, 8 px controls / 12 px cards, one field / alert / steps /
   facts vocabulary. Documented in docs/PORTEXA_UI_SYSTEM.md.
   ========================================================================== */

.pds-page {
    --pds-page-gap: 56px;
    /* minmax(0, 1fr): a wide child (a scrolling strip, a table) scrolls inside
       itself instead of widening the page past the screen. */
    display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--pds-page-gap);
    max-width: 1200px; margin: 0 auto; padding: 32px 0 56px;
    font-size: var(--public-type-body); line-height: 1.6; color: var(--text-body);
}
/* Zero specificity: components keep their own margins (eyebrow, lead, CTA). */
:where(.pds-page) p { margin: 0; }
:where(.pds-page) a:not([class]) { color: var(--portexa-primary-ink); text-underline-offset: 3px; }

/* The opening statement beside a short fact sheet. */
.pds-lede { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 48px; align-items: start; }
.pds-display {
    margin: 0; max-width: 20ch;
    font-size: var(--public-type-display); font-weight: 800; line-height: 1.1; letter-spacing: -0.02em;
    color: var(--text-primary);
}
.pds-display em { font-style: normal; color: var(--portexa-primary-ink); }
.pds-lede .pds-lead { max-width: 62ch; }
.pds-actions-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

/* A block of the page: a 24 px heading with one line under it. */
.pds-block { display: grid; gap: 24px; }
.pds-block__head { display: grid; gap: 6px; max-width: 72ch; }
.pds-block__title { margin: 0; font-size: var(--public-type-block); font-weight: 700; line-height: 1.3; letter-spacing: -0.01em; color: var(--text-primary); }
.pds-block__sub { font-size: var(--public-type-body); color: var(--text-muted); }
.pds-reading { max-width: 70ch; display: grid; gap: 16px; }
.pds-reading strong { color: var(--text-primary); }

/* Fact sheet: short labelled facts, not KPI tiles. */
.pds-facts { padding: 8px 20px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.pds-facts__title { margin: 12px 0 4px; font-size: var(--public-type-meta); font-weight: 600; color: var(--text-muted); }
.pds-facts dl { margin: 0; }
.pds-facts dl > div { display: grid; grid-template-columns: minmax(0, 9rem) minmax(0, 1fr); gap: 12px; padding: 12px 0; border-top: 1px solid var(--border-row); }
.pds-facts dl > div:first-child { border-top: 0; }
.pds-facts dt { font-size: var(--public-type-meta); color: var(--text-muted); }
.pds-facts dd { margin: 0; font-size: var(--public-type-card-text); font-weight: 600; color: var(--text-primary); }

/* Cards on these pages: 12 px radius; an icon, a title, a sentence. */
.pds-page .pds-card { border-radius: var(--radius-lg); }
.pds-feature, a.pds-card.pds-feature { display: flex; flex-direction: column; gap: 10px; height: 100%; }
.pds-feature__title { margin: 4px 0 0; font-size: var(--public-type-card); font-weight: 700; line-height: 1.35; color: var(--text-primary); }
.pds-feature p { font-size: var(--public-type-card-text); line-height: 1.55; color: var(--text-body); }
a.pds-feature .pds-feature__title { display: flex; align-items: center; gap: 6px; }
a.pds-feature .pds-feature__title i { font-size: 12px; color: var(--text-muted); transition: transform var(--pds-ease); }
a.pds-feature:hover .pds-feature__title i { transform: translateX(2px); color: var(--portexa-primary-ink); }
.pds-group + .pds-group { margin-top: 32px; }
.pds-group__title { margin: 0 0 14px; font-size: var(--public-type-card); font-weight: 700; color: var(--text-primary); }
.pds-group__title small { display: block; margin-top: 2px; font-size: var(--public-type-meta); font-weight: 400; color: var(--text-muted); }

/* Lists: ticks for what is included, plain for commitments. */
.pds-checklist { display: grid; gap: 8px; margin: 4px 0 0; padding: 0; list-style: none; font-size: var(--public-type-card-text); color: var(--text-secondary); }
.pds-checklist li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; }
.pds-checklist i { margin-top: 5px; font-size: 13px; color: var(--positive); }
.pds-checklist b { color: var(--text-primary); font-weight: 600; }

/* Numbered steps (an engagement, a ticket's life). */
.pds-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; counter-reset: pds-step; }
.pds-steps--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pds-step { counter-increment: pds-step; padding: 20px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.pds-step::before {
    content: counter(pds-step);
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; border-radius: 999px;
    font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums;
    color: var(--portexa-primary-ink); background: var(--portexa-primary-soft);
}
.pds-step h3 { margin: 12px 0 4px; font-size: var(--public-type-card); font-weight: 700; color: var(--text-primary); }
.pds-step p { font-size: var(--public-type-card-text); line-height: 1.55; color: var(--text-body); }
.pds-step .pds-small { display: block; margin-top: 6px; }

/* Ways to reach us: an icon, what it is, the address, a note. */
.pds-contact-list { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.pds-contact-list > li > a, .pds-contact-list > li > div {
    display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 14px; align-items: start;
    padding: 16px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface);
    color: inherit; text-decoration: none;
}
.pds-contact-list > li > a:hover { border-color: var(--border-strong); box-shadow: var(--pds-shadow-sm); }
.pds-contact-list .pds-card__icon { width: 40px; height: 40px; }
.pds-contact-list span:not(.pds-card__icon) { display: block; font-size: var(--public-type-caption); color: var(--text-muted); }
.pds-contact-list b { display: block; font-size: var(--public-type-item); font-weight: 600; color: var(--text-primary); overflow-wrap: anywhere; }
.pds-contact-list small { display: block; margin-top: 2px; font-size: var(--public-type-meta); color: var(--text-muted); }

/* Forms: a visible label above every field, help and error text tied to it
   (Django links them: aria-describedby="<id>_helptext <id>_error"). */
.pds-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 16px; }
.pds-form .is-full { grid-column: 1 / -1; }
.pds-field { display: grid; gap: 6px; align-content: start; min-width: 0; }
.pds-field > label { font-size: var(--public-type-meta); font-weight: 600; color: var(--text-primary); }
.pds-req { margin-left: 2px; color: var(--negative); }
.pds-input {
    width: 100%; min-height: 44px; padding: 10px 12px;
    border: 1px solid var(--control-border); border-radius: var(--radius-md);
    background: var(--surface); color: var(--text-primary);
    font: 400 var(--public-type-card-text)/1.4 var(--font-sans);
    transition: border-color var(--pds-ease), box-shadow var(--pds-ease);
}
.pds-input::placeholder { color: var(--text-muted); opacity: 1; }
.pds-input:hover { border-color: var(--control-border-hover); }
.pds-input:focus { outline: none; border-color: var(--portexa-primary); box-shadow: var(--pds-focus); }
textarea.pds-input { min-height: 160px; resize: vertical; line-height: 1.55; }
select.pds-input { appearance: auto; }
.pds-help { font-size: var(--public-type-caption); line-height: 1.45; color: var(--text-muted); }
.pds-error { display: flex; gap: 6px; font-size: var(--public-type-caption); font-weight: 600; line-height: 1.45; color: var(--negative); }
.pds-error i { margin-top: 3px; font-size: 12px; }
.pds-field.has-error .pds-input { border-color: var(--negative); }
.pds-form-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.pds-form-foot .pds-small { max-width: 46ch; }

/* Alerts and the error summary at the top of a form. */
.pds-alert {
    display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; align-items: start;
    padding: 14px 16px; border: 1px solid var(--border); border-left-width: 4px; border-radius: var(--radius-md);
    background: var(--surface-soft); font-size: var(--public-type-card-text); line-height: 1.5; color: var(--text-secondary);
}
.pds-alert i { margin-top: 4px; }
.pds-alert b { color: var(--text-primary); }
.pds-alert ul { margin: 6px 0 0; padding-left: 18px; }
.pds-alert--error { border-color: var(--negative); background: var(--negative-soft); }
.pds-alert--error i { color: var(--negative); }
.pds-alert--success { border-color: var(--positive); background: var(--positive-soft); }
.pds-alert--success i { color: var(--positive); }
.pds-alert--info { border-color: var(--portexa-primary-ink); background: var(--portexa-primary-soft); }
.pds-alert--info i { color: var(--portexa-primary-ink); }

/* Two columns: the main task, and what supports it. */
.pds-split { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 32px; align-items: start; }
.pds-aside { display: grid; gap: 24px; }
.pds-aside__title { margin: 0 0 12px; font-size: var(--public-type-card); font-weight: 700; color: var(--text-primary); }

/* A member's recent tickets: number, subject, status. */
.pds-tickets { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pds-tickets a {
    display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center;
    padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--radius-md);
    color: inherit; text-decoration: none; font-size: var(--public-type-meta);
}
.pds-tickets a:hover { border-color: var(--border-strong); }
.pds-tickets .pds-num { font-weight: 700; color: var(--text-primary); }
.pds-tickets .subject { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-secondary); }

@media (max-width: 1023px) {
    .pds-page { --pds-page-gap: 48px; }
    .pds-lede, .pds-split { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    .pds-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .pds-page { --pds-page-gap: 40px; padding: 20px 0 32px; }
    .pds-form, .pds-steps, .pds-steps--2 { grid-template-columns: minmax(0, 1fr); }
    .pds-input { font-size: 16px; }                  /* no zoom-on-focus on iOS */
    .pds-facts dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
    .pds-actions-row .pds-btn, .pds-form-foot .pds-btn { width: 100%; }
    .pds-tickets a { grid-template-columns: minmax(0, 1fr) auto; }
    .pds-tickets .subject { grid-column: 1 / -1; grid-row: 2; }
}

/* ==========================================================================
   Company pages and the Market Guide — the same layer, a few more pieces:
   the section strip (components/_company_nav.html, market_guide/_strip.html),
   the company-valuation spotlight (components/_valuation_engines.html) and
   long-form reading for the guides (templates/market_guide/*). Documented
   in docs/PORTEXA_UI_SYSTEM.md.
   ========================================================================== */

/* Alerts double as the guides' callouts: a warning tone, and a first bold
   phrase that reads as the callout's title. */
.pds-alert--warning { border-color: var(--warning); background: var(--warning-soft); }
.pds-alert--warning i { color: var(--warning-ink); }
.pds-alert > div > b:first-child { display: block; margin-bottom: 2px; }

/* Badges on reading pages carry words (a level, a topic, a count), so they
   keep to the 12 px floor. */
.pds-page .pds-badge, .pds-spotlight .pds-badge { height: 24px; font-size: var(--public-type-label); }

/* Icon tones — the text beside the icon carries the meaning, never the colour. */
.pds-card__icon--up { background: var(--positive-soft); color: var(--positive); }
.pds-card__icon--down { background: var(--negative-soft); color: var(--negative); }
.pds-card__icon--warn { background: var(--warning-soft); color: var(--warning-ink); }

/* Section strip: the company's own pages, or the guide's journey. The page
   it is on carries aria-current; the rest scroll sideways on a phone. */
.pds-subnav {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 24px;
    padding: 6px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface);
}
.pds-page > .pds-subnav { margin-bottom: calc(28px - var(--pds-page-gap)); }   /* sits close to what it introduces */
.pds-subnav__owner { display: flex; align-items: flex-start; gap: 10px; min-width: 0; margin: 0; padding: 6px 10px; font-size: var(--public-type-meta); line-height: 1.4; color: var(--text-muted); }
.pds-subnav__owner i { margin-top: 3px; color: var(--portexa-primary-ink); }
.pds-subnav__owner b { font-weight: 600; color: var(--text-primary); }
.pds-subnav ul { display: flex; gap: 4px; min-width: 0; max-width: 100%; margin: 0; padding: 0; list-style: none; overflow-x: auto; scrollbar-width: none; }
.pds-subnav ul::-webkit-scrollbar { display: none; }
.pds-subnav a {
    display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px;
    border-radius: var(--radius-md); font-size: var(--public-type-meta); font-weight: 600; white-space: nowrap;
    color: var(--text-secondary); text-decoration: none;
}
.pds-subnav a:hover { background: var(--surface-soft); color: var(--text-primary); }
.pds-subnav a[aria-current] { background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); }
.pds-subnav__n {
    display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px;
    border: 1px solid var(--border); border-radius: 999px; background: var(--surface-soft);
    font-size: var(--public-type-label); font-variant-numeric: tabular-nums; color: var(--text-secondary);
}
.pds-subnav a[aria-current] .pds-subnav__n { border-color: transparent; background: var(--portexa-primary-ink); color: var(--surface); }
.pds-subnav--journey ul { flex: 1 1 auto; }
.pds-subnav.px-pinned { border-top: 0; border-radius: 0 0 var(--radius-lg) var(--radius-lg); box-shadow: var(--pds-shadow-menu); }

/* The company-valuation spotlight: the product's flagship, set apart by an
   accent edge and a tint, with the lead engine full width. */
.pds-spotlight {
    display: grid; gap: 24px; padding: 32px;
    border: 1px solid var(--border); border-top: 4px solid var(--portexa-primary-ink); border-radius: var(--radius-xl);
    background: linear-gradient(180deg, var(--portexa-primary-soft), var(--surface) 420px);
    font-size: var(--public-type-body); line-height: 1.6; color: var(--text-body);
}
.pds-spotlight p { margin: 0; }
.pds-spotlight__head { display: grid; gap: 10px; max-width: 76ch; }
.pds-spotlight__head .pds-eyebrow { margin: 0; }
.pds-spotlight__title {
    margin: 0; font-size: var(--public-type-article); font-weight: 800; line-height: 1.2; letter-spacing: -0.015em;
    color: var(--text-primary);
}
.pds-spotlight__lead { font-size: var(--public-type-lead); line-height: 1.6; color: var(--text-body); }
.pds-spotlight .pds-card { border-radius: var(--radius-lg); }
.pds-engine { display: flex; flex-direction: column; gap: 10px; }
.pds-engine .pds-link { margin-top: auto; padding-top: 4px; }
.pds-engine .pds-feature__title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pds-engine--lead { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 20px 40px; align-items: start; }
.pds-engine__text { display: flex; flex-direction: column; gap: 10px; }
.pds-engine__text p { font-size: var(--public-type-body); line-height: 1.6; }
.pds-engine__text .pds-link { margin-top: 4px; }
.pds-engine__links { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: auto; padding-top: 4px; }
.pds-audience { display: grid; gap: 10px; align-content: start; padding: 24px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.pds-audience__title { display: flex; align-items: center; gap: 12px; margin: 0; font-size: var(--public-type-card); font-weight: 700; color: var(--text-primary); }
.pds-audience > p { font-weight: 600; color: var(--text-secondary); }

/* ── The Market Guide: long-form reading ─────────────────────────────────
   The guide column and its table of contents switch to one column by the
   space the page actually has (a container query), so a member's sidebar
   and a visitor's full width both get a readable column; the viewport rule
   under it covers browsers without container queries. */
.pds-page--guide { container-type: inline-size; container-name: pds-guide; }
.pds-lede--guide .pds-display { max-width: 26ch; }
.pds-guide { display: grid; grid-template-columns: minmax(0, 1fr) 248px; gap: 48px; align-items: start; }
.pds-guide__main { display: grid; gap: 40px; min-width: 0; }
.pds-guide__stack { display: grid; gap: 40px; min-width: 0; }
.pds-guide__aside { display: grid; gap: 16px; }
.pds-toc-card { padding: 16px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.pds-toc-card__title { margin: 0 0 8px; font-size: var(--public-type-meta); font-weight: 600; color: var(--text-muted); }
.pds-toc a.is-active { background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); font-weight: 600; }
.pds-toc-mobile { display: none; margin-bottom: -16px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.pds-toc-mobile summary {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 0 16px;
    font-size: var(--public-type-card-text); font-weight: 600; color: var(--text-primary); cursor: pointer; list-style: none;
}
.pds-toc-mobile summary::-webkit-details-marker { display: none; }
.pds-toc-mobile summary > i { font-size: 12px; color: var(--text-muted); transition: transform var(--pds-ease); }
.pds-toc-mobile[open] summary > i { transform: rotate(180deg); }
.pds-toc-mobile[open] summary { border-bottom: 1px solid var(--border-row); }
.pds-toc-mobile .pds-toc { padding: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@container pds-guide (max-width: 879px) {
    .pds-guide { grid-template-columns: minmax(0, 1fr); }
    .pds-guide__aside { display: none; }
    .pds-toc-mobile { display: block; }
}
@container pds-guide (max-width: 519px) {
    .pds-toc-mobile .pds-toc { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1023px) {
    .pds-guide { grid-template-columns: minmax(0, 1fr); }
    .pds-guide__aside { display: none; }
    .pds-toc-mobile { display: block; }
}

/* A numbered section of a guide: number, heading, one line under it. */
.pds-guide-section {
    display: grid; gap: 20px; min-width: 0; padding-top: 32px; border-top: 1px solid var(--border);
    scroll-margin-top: calc(3.5rem + var(--page-header-height, 5.5rem) + 4.5rem);
}
.pds-guide-section[hidden] { display: none; }
.pds-guide-section__head { display: flex; align-items: flex-start; gap: 14px; }
.pds-guide-section__head > div { flex: 1 1 auto; min-width: 0; }
.pds-guide-section__head > .pds-badge { flex: none; margin-top: 8px; }
.pds-guide-section__no {
    display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 8px;
    border-radius: 999px; background: var(--portexa-primary-soft); color: var(--portexa-primary-ink);
    font-size: var(--public-type-meta); font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.pds-guide-section__head .pds-block__sub { margin-top: 4px; }
.pds-guide-section > p, .pds-cols > div > p { max-width: 70ch; }
.pds-guide-section strong { color: var(--text-primary); }
.pds-subhead { margin: 4px 0 0; font-size: var(--public-type-card); font-weight: 700; line-height: 1.35; color: var(--text-primary); }
.pds-anchor {
    display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-top: 2px;
    border-radius: var(--radius-sm); font-size: 13px; color: var(--text-muted); text-decoration: none; opacity: 0;
    transition: opacity var(--pds-ease);
}
.pds-guide-section:hover .pds-anchor, .pds-anchor:focus-visible { opacity: 1; }
.pds-anchor:hover { color: var(--portexa-primary-ink); background: var(--surface-soft); }
.pds-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 20px; }
.pds-cols > div { display: grid; gap: 12px; align-content: start; min-width: 0; }

/* Grids inside the guide column size to the column, not the screen. */
.pds-guide .pds-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, max(240px, (100% - 20px) / 2)), 1fr)); }
.pds-guide .pds-grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, max(200px, (100% - 40px) / 3)), 1fr)); }
.pds-guide .pds-steps { grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); }
.pds-guide .pds-step { padding: 16px; }
.pds-guide .pds-metric__value { font-size: 20px; white-space: normal; overflow: visible; }
.pds-guide .pds-pager { margin-top: 0; }

/* Steps whose markers are words, not numbers: T, T+1, T+2. */
.pds-steps--labelled .pds-step::before { content: attr(data-label); width: auto; min-width: 32px; padding: 0 8px; }
.pds-metric__sub { display: block; margin-top: 4px; font-size: var(--public-type-caption); line-height: 1.45; color: var(--text-muted); }

/* A vertical timeline for step-by-step procedures. */
.pds-timeline { display: grid; margin: 0; padding: 0; list-style: none; counter-reset: pds-timeline; }
.pds-timeline > li { position: relative; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 16px; padding-bottom: 24px; counter-increment: pds-timeline; }
.pds-timeline > li::before {
    content: counter(pds-timeline);
    display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 999px;
    background: var(--portexa-primary-soft); color: var(--portexa-primary-ink);
    font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.pds-timeline > li::after { content: ''; position: absolute; left: 17px; top: 42px; bottom: 6px; width: 2px; background: var(--border); }
.pds-timeline > li:last-child { padding-bottom: 0; }
.pds-timeline > li:last-child::after { display: none; }
.pds-timeline > li > div { display: grid; gap: 8px; min-width: 0; }
.pds-timeline h3 { margin: 6px 0 0; font-size: var(--public-type-card); font-weight: 700; line-height: 1.35; color: var(--text-primary); }
.pds-timeline h3 small { margin-left: 8px; font-size: var(--public-type-caption); font-weight: 500; color: var(--text-muted); }
.pds-timeline p { max-width: 68ch; }

/* Reading tables: text wraps, row headers name the row. */
.pds-table--text th { height: auto; padding: 10px 16px; font-size: var(--public-type-caption); letter-spacing: 0; text-transform: none; }
.pds-table.pds-table--text td, .pds-table.pds-table--text tbody th {
    height: auto; padding: 12px 16px; vertical-align: top; white-space: normal;
    font-size: var(--public-type-meta); line-height: 1.5;
}
.pds-table.pds-table--text tbody th { min-width: 9rem; font-weight: 600; color: var(--text-primary); background: none; }
.pds-table--text .is-num { white-space: nowrap; }
.pds-table--text tfoot td, .pds-table--text tfoot th {
    padding: 12px 16px; border-top: 1px solid var(--border); background: var(--surface-soft);
    font-size: var(--public-type-meta); font-weight: 700; color: var(--text-primary); text-align: left; white-space: normal;
}
.pds-table--text tfoot .is-num { text-align: right; }

/* Term : meaning rows. */
.pds-defs { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); margin: 0; border-top: 1px solid var(--border-row); }
.pds-defs dt, .pds-defs dd { padding: 12px 0; border-bottom: 1px solid var(--border-row); font-size: var(--public-type-card-text); }
.pds-defs dt { padding-right: 16px; font-weight: 600; color: var(--text-primary); }
.pds-defs dd { margin: 0; color: var(--text-body); }
@container pds-guide (max-width: 559px) {
    .pds-guide-section__head > .pds-badge { display: none; }          /* the chips carry the counts */
    .pds-defs { grid-template-columns: minmax(0, 1fr); }
    .pds-defs dt { padding-bottom: 0; border-bottom: 0; }
    .pds-defs dd { padding-top: 2px; }
}

/* Search, filter chips and the empty state (FAQ, glossary). */
.pds-finder { display: grid; gap: 16px; padding: 20px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.pds-finder__row { display: flex; flex-wrap: wrap; align-items: end; gap: 12px 16px; }
.pds-finder__row .pds-field { flex: 1 1 18rem; }
.pds-finder__count { margin: 0 0 12px; font-size: var(--public-type-meta); color: var(--text-muted); white-space: nowrap; }
.pds-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pds-chip {
    display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px;
    border: 1px solid var(--control-border); border-radius: 999px; background: var(--surface);
    font: 600 var(--public-type-meta)/1 var(--font-sans); color: var(--text-secondary); cursor: pointer;
    transition: border-color var(--pds-ease), background-color var(--pds-ease), color var(--pds-ease);
}
.pds-chip i { font-size: 12px; }
.pds-chip:hover { border-color: var(--control-border-hover); color: var(--text-primary); }
a.pds-chip { text-decoration: none; }
.pds-chip small { font-size: var(--public-type-label); font-weight: 500; font-variant-numeric: tabular-nums; color: var(--text-muted); }
.pds-chip[aria-pressed="true"], .pds-chip[aria-current] { border-color: var(--portexa-primary-ink); background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); }
.pds-letters { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; }
.pds-letters a {
    display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 6px;
    border-radius: var(--radius-md); font-size: var(--public-type-meta); font-weight: 600; color: var(--text-secondary); text-decoration: none;
}
.pds-letters a:hover { background: var(--surface-soft); color: var(--text-primary); }
.pds-letters a.is-empty { color: var(--text-muted); opacity: 0.45; pointer-events: none; }
.pds-empty { padding: 24px 16px; border: 1px dashed var(--border-strong); border-radius: var(--radius-lg); text-align: center; font-size: var(--public-type-card-text); color: var(--text-muted); }
.pds-empty[hidden] { display: none; }

/* Questions and answers on native <details>. */
.pds-faq { border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); overflow: hidden; }
.pds-faq details + details { border-top: 1px solid var(--border-row); }
.pds-faq details[hidden] { display: none; }
.pds-faq summary {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; min-height: 52px; padding: 14px 16px;
    font-size: var(--public-type-item); font-weight: 600; line-height: 1.45; color: var(--text-primary); cursor: pointer; list-style: none;
}
.pds-faq summary::-webkit-details-marker { display: none; }
.pds-faq summary:hover { background: var(--surface-soft); }
.pds-faq summary .pds-badge { margin-left: 8px; vertical-align: middle; }
.pds-faq summary > i { font-size: 12px; color: var(--text-muted); transition: transform var(--pds-ease); }
.pds-faq details[open] summary > i { transform: rotate(180deg); }
.pds-faq__answer { display: grid; gap: 10px; max-width: 72ch; padding: 0 16px 16px; color: var(--text-body); }
.pds-faq__answer p { margin: 0; }
.pds-faq .pds-empty { margin: 16px; }

/* Glossary terms. */
.pds-terms { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 16px; }
.pds-term {
    display: flex; flex-direction: column; gap: 8px; padding: 18px; min-width: 0;
    border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface);
    scroll-margin-top: calc(3.5rem + var(--page-header-height, 5.5rem) + 4.5rem);
}
.pds-term[hidden] { display: none; }
.pds-term header { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px; }
.pds-term h3 { margin: 0; font-size: var(--public-type-card); font-weight: 700; line-height: 1.35; color: var(--text-primary); }
.pds-term p { font-size: var(--public-type-card-text); line-height: 1.55; }
.pds-term__example { padding: 10px 12px; border-radius: var(--radius-md); background: var(--surface-soft); font-size: var(--public-type-meta); color: var(--text-secondary); }
.pds-term__example b { color: var(--text-primary); }

/* Reading progress along the top of the window (market-guide.js sets
   --mg-progress, 0–1), above the header and below the menus. */
.pds-readbar { position: fixed; top: 0; left: 0; right: 0; z-index: var(--z-dropdown, 70); height: 3px; pointer-events: none; }
.pds-readbar span { display: block; height: 100%; background: var(--portexa-primary-ink); transform-origin: 0 50%; transform: scaleX(var(--mg-progress, 0)); }

/* What to remember: the guide's points, closing the article. */
.pds-remember {
    display: grid; gap: 14px; padding: 24px;
    border: 1px solid var(--border); border-left: 4px solid var(--portexa-primary-ink); border-radius: var(--radius-lg);
    background: var(--portexa-primary-soft);
}
.pds-remember__title { display: flex; align-items: center; gap: 10px; margin: 0; font-size: var(--public-type-block); font-weight: 700; line-height: 1.3; color: var(--text-primary); }
.pds-remember__title i { font-size: 18px; color: var(--portexa-primary-ink); }
.pds-remember .pds-checklist { gap: 10px; font-size: var(--public-type-body); color: var(--text-body); }
.pds-remember__done { display: flex; align-items: center; gap: 8px; font-size: var(--public-type-caption); font-weight: 600; color: var(--positive); }
.pds-remember__done[hidden], [data-mg-status-row][hidden], .pds-badge[hidden] { display: none; }

/* The guide home: the numbers to know, and the reader's progress. */
.pds-essentials { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.pds-essentials a {
    display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 16px;
    border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface);
    color: inherit; text-decoration: none; transition: border-color var(--pds-ease), box-shadow var(--pds-ease);
}
.pds-essentials a:hover { border-color: var(--portexa-primary-ink); box-shadow: var(--pds-shadow-sm); }
.pds-essentials__label { font-size: var(--public-type-caption); font-weight: 600; color: var(--text-muted); }
.pds-essentials__value {
    font-size: var(--public-type-block); font-weight: 800; line-height: 1.2; letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums; color: var(--text-primary);
}
.pds-essentials__note { font-size: var(--public-type-caption); line-height: 1.45; color: var(--text-body); }
.pds-essentials__more { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 8px; font-size: var(--public-type-caption); font-weight: 600; color: var(--portexa-primary-ink); }
.pds-essentials__more i { font-size: 11px; transition: transform var(--pds-ease); }
.pds-essentials a:hover .pds-essentials__more i { transform: translateX(2px); }
.pds-meter { height: 8px; margin: 4px 0 8px; overflow: hidden; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-soft); }
.pds-meter span { display: block; width: calc(var(--mg-progress, 0) * 100%); height: 100%; border-radius: inherit; background: var(--positive); transition: width .3s ease; }
.pds-facts__note { margin: 4px 0 12px; font-size: var(--public-type-caption); color: var(--text-muted); }
.pds-contact-list--grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
@media (max-width: 1023px) { .pds-essentials { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 380px) { .pds-essentials { grid-template-columns: minmax(0, 1fr); } }

/* The guide hub: the journey as ordered cards. */
.pds-journey { margin: 0; padding: 0; list-style: none; }
.pds-journey__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pds-journey__n { font-size: var(--public-type-caption); font-weight: 600; color: var(--text-muted); }
.pds-journey .pds-card__meta { margin-top: auto; padding-top: 6px; }
.pds-pager b { display: block; font-size: var(--public-type-item); font-weight: 600; }
.pds-pager span { display: block; margin-top: 2px; font-size: var(--public-type-meta); color: var(--text-muted); }
.pds-disclaimer { padding-top: 20px; border-top: 1px solid var(--border); font-size: var(--public-type-meta); line-height: 1.6; color: var(--text-muted); }
.pds-disclaimer b { color: var(--text-secondary); }

@media (max-width: 1023px) {
    .pds-engine--lead { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
    .pds-spotlight { gap: 20px; padding: 24px 18px; }
    .pds-subnav { padding: 4px; }
    .pds-subnav__owner { padding: 6px 8px; font-size: 13px; }
    .pds-subnav a { padding: 0 12px; }
    .pds-guide-section__head { gap: 12px; }
    .pds-finder { padding: 16px; }
}

/* ── The newsroom: Circulars, Market News, Company News ─────────────────
   The reader pages of News & Impact's newsroom (templates/news_impact/
   _base_newsroom.html; built by news_impact/newsroom.py). A news site's
   order: the desk (totals and search), the front (Market News), then the
   feed under day or month headings beside a sidebar. The list switches to
   one column by the space the page has (a container query), so a member's
   sidebar and a visitor's full width both read well. Every other News &
   Impact page keeps news-impact.css. */
.pds-page--newsroom { --pds-page-gap: 28px; container-type: inline-size; container-name: pds-news; }
/* Links in the strip's first line are words in a sentence, not tabs. */
.pds-subnav__owner a {
    display: inline; min-height: 0; padding: 0; border-radius: 0; white-space: normal;
    font-weight: 600; color: var(--portexa-primary-ink); text-decoration: none;
}
.pds-subnav__owner a:hover { background: none; color: var(--portexa-primary-ink); text-decoration: underline; text-underline-offset: 3px; }

/* Badge tones — the same code → tone map as every News & Impact list
   (news_impact_extras.status_tone); the words carry the meaning. */
.pds-badge--info, .pds-badge--accent { background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); border-color: transparent; }
.pds-badge--up { background: var(--positive-soft); color: var(--positive); border-color: transparent; }
.pds-badge--warn { background: var(--warning-soft); color: var(--warning-ink); border-color: transparent; }
.pds-badge--down { background: var(--negative-soft); color: var(--negative-ink); border-color: transparent; }
.pds-badge--muted { background: var(--surface-soft); color: var(--text-secondary); }

/* The desk: what is on record, the search and filters, in one card. */
.pds-desk { display: grid; gap: 14px; padding: 16px 20px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.pds-desk__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 24px; }
.pds-desk__title { margin: 0; font-size: var(--public-type-card); font-weight: 700; line-height: 1.3; color: var(--text-primary); }
.pds-desk__stats { display: flex; flex-wrap: wrap; gap: 4px 20px; margin: 0; }
.pds-desk__stats > div { display: flex; align-items: baseline; gap: 6px; }
.pds-desk__stats dt { font-size: var(--public-type-caption); color: var(--text-muted); }
.pds-desk__stats dd { margin: 0; font-size: var(--public-type-meta); font-weight: 700; color: var(--text-primary); }
.pds-desk .pds-input { min-height: 40px; padding-top: 8px; padding-bottom: 8px; }
.pds-desk .pds-btn { min-height: 40px; padding-top: 0; padding-bottom: 0; }
.pds-desk .pds-chip { min-height: 34px; padding: 0 12px; }
.pds-desk .pds-finder__count { margin: 0; }

/* A labelled search form (a form — the blog's chip list is ul.pds-filter). */
form.pds-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 14px; margin: 0; }   /* the shell gives forms a bottom margin */
form.pds-filter .pds-field { flex: 1 1 11rem; }
form.pds-filter .pds-filter__wide { flex: 3 1 18rem; }
form.pds-filter .pds-filter__narrow { flex: 0 1 9rem; }
.pds-filter__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.pds-chip-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.pds-chip-row__label { min-width: 5.5rem; font-size: var(--public-type-meta); font-weight: 600; color: var(--text-secondary); }

/* The feed beside its sidebar. */
.pds-news { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 40px; align-items: start; }
.pds-news__main { display: grid; gap: 28px; min-width: 0; }
.pds-news__aside { display: grid; gap: 16px; min-width: 0; align-content: start; }
/* A day (or month) of the feed: a ruled heading, then the rows. */
.pds-day { display: grid; min-width: 0; }
.pds-day__title, .pds-top-stories__title {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 0; padding-bottom: 10px;
    border-bottom: 2px solid var(--text-primary);
    font-size: var(--public-type-meta); font-weight: 700; letter-spacing: .06em; line-height: 1.3; text-transform: uppercase;
    color: var(--text-primary);
}
.pds-day__title small { font-size: var(--public-type-caption); font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--text-muted); }
.pds-news-list, .pds-top-stories ol { margin: 0; padding: 0; list-style: none; }
.pds-news-list > li + li, .pds-top-stories li + li { border-top: 1px solid var(--border-row); }

/* The line over every headline: where it is from, when, what kind. */
.pds-kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; font-size: var(--public-type-caption); line-height: 1.4; color: var(--text-muted); }
.pds-kicker b { font-weight: 600; color: var(--portexa-primary-ink); }
.pds-kicker > :is(time, span:not(.pds-badge)):not(:first-child)::before { content: '·'; margin-right: 8px; color: var(--border-strong); }
.pds-kicker i { margin-right: 4px; }

/* Headlines: one size for a row of any desk; the lead story is larger. */
.pds-news-row__title, .pds-notice__title, .pds-circular__title {
    margin: 0; font-size: var(--public-type-card); font-weight: 650; line-height: 1.4; color: var(--text-primary);
}
:is(.pds-news-row__title, .pds-lead-story__title, .pds-notice__title, .pds-circular__title, .pds-side-news) a { color: inherit; text-decoration: none; }
:is(.pds-news-row__title, .pds-lead-story__title, .pds-notice__title, .pds-circular__title, .pds-side-news) a:hover { color: var(--portexa-primary-ink); text-decoration: underline; text-underline-offset: 3px; }
.pds-news-row__summary, .pds-notice__summary {
    font-size: var(--public-type-card-text); line-height: 1.55; color: var(--text-body);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* A story row: the words, and the story's own picture beside them. */
.pds-news-row { display: flex; align-items: flex-start; gap: 20px; padding: 18px 0; }
.pds-news-row__body { display: grid; gap: 6px; flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.pds-news-row__body .pds-row-actions { justify-self: start; }
.pds-news-row__thumb { flex: none; width: 128px; aspect-ratio: 3 / 2; border-radius: var(--radius-md); overflow: hidden; background: var(--surface-soft); }
.pds-news-row__thumb[hidden] { display: none; }
.pds-news-row__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pds-news-row.is-compact { gap: 14px; padding: 14px 0; }
.pds-news-row.is-compact .pds-news-row__title { font-size: var(--public-type-item); }
.pds-news-row.is-compact .pds-news-row__thumb { width: 84px; }

/* The front: the lead story beside the top stories. */
.pds-front { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 32px; align-items: start; padding-bottom: 28px; border-bottom: 1px solid var(--border); }
.pds-lead-story { display: grid; gap: 16px; min-width: 0; }
.pds-lead-story__cover { display: block; border-radius: var(--radius-lg); overflow: hidden; background: var(--surface-soft); }
.pds-lead-story__cover[hidden] { display: none; }
.pds-lead-story__cover img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.pds-lead-story__body { display: grid; gap: 10px; min-width: 0; overflow-wrap: anywhere; }
.pds-lead-story__title { margin: 0; font-size: var(--public-type-article); font-weight: 800; line-height: 1.2; letter-spacing: -0.015em; color: var(--text-primary); }
.pds-lead-story__summary { max-width: 64ch; font-size: var(--public-type-lead); line-height: 1.55; color: var(--text-body); }
.pds-lead-story__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 2px; }
.pds-top-stories { display: grid; align-content: start; min-width: 0; }

/* A notice or circular row: the company's symbol or the date, then the item. */
.pds-notice, .pds-circular { display: grid; grid-template-columns: 5.75rem minmax(0, 1fr); gap: 16px; align-items: start; padding: 16px 0; }
.pds-circular { grid-template-columns: 3.5rem minmax(0, 1fr); }
.pds-notice__mark { padding-top: 2px; }
.pds-notice__mark .pds-symbol { width: 100%; justify-content: center; }
.pds-symbol.is-exchange { border-style: dashed; color: var(--text-secondary); }
.pds-notice__body, .pds-circular__body { display: grid; gap: 6px; min-width: 0; overflow-wrap: anywhere; }
.pds-notice__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 2px 0 0; }
.pds-notice__foot .pds-link { font-size: var(--public-type-meta); }
.pds-notice__foot .pds-row-actions { margin-left: auto; }
.pds-feed__date { display: grid; justify-items: center; gap: 2px; padding: 8px 4px; border-radius: var(--radius-md); background: var(--surface-soft); text-align: center; line-height: 1.15; }
.pds-feed__date b { font-size: var(--public-type-card); font-weight: 700; font-variant-numeric: tabular-nums; color: var(--text-primary); }
.pds-feed__date small { font-size: var(--public-type-label); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); }

/* The sidebar: lists that filter the page, and the other desks' latest. */
.pds-side-card { display: grid; gap: 10px; padding: 16px 18px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); min-width: 0; }
.pds-side-card__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: var(--public-type-caption); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-primary); }
.pds-side-card__title i { font-size: 12px; color: var(--portexa-primary-ink); }
.pds-side-card__more { font-size: var(--public-type-meta); }
.pds-side-card__note { font-size: var(--public-type-caption); line-height: 1.5; color: var(--text-muted); }
.pds-side-card__note a { color: var(--portexa-primary-ink); }
.pds-side-list { display: grid; min-width: 0; margin: 0 -8px; padding: 0; list-style: none; }
.pds-side-list a {
    display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 7px 8px;
    border-radius: var(--radius-sm); font-size: var(--public-type-meta); color: var(--text-secondary); text-decoration: none;
}
.pds-side-list a:hover { background: var(--surface-soft); color: var(--text-primary); }
.pds-side-list a[aria-current] { background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); font-weight: 600; }
.pds-side-list span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pds-side-list b { font-weight: 600; color: var(--text-primary); }
.pds-side-list em { font-style: normal; color: var(--text-muted); }
.pds-side-list small { flex: none; font-size: var(--public-type-caption); font-variant-numeric: tabular-nums; color: var(--text-muted); }
.pds-side-news { display: grid; min-width: 0; margin: 0; padding: 0; list-style: none; }
.pds-side-news li { display: grid; gap: 3px; padding: 10px 0; min-width: 0; }
.pds-side-news li:first-child { padding-top: 0; }
.pds-side-news li + li { border-top: 1px solid var(--border-row); }
.pds-side-news li > a, .pds-side-news li > span {
    font-size: var(--public-type-meta); font-weight: 600; line-height: 1.4; color: var(--text-primary); overflow-wrap: anywhere;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.pds-side-news small { font-size: var(--public-type-caption); color: var(--text-muted); }
.pds-side-news small b { font-weight: 600; color: var(--text-secondary); }

/* A story's tags on its own page. */
.pds-story__tags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
/* Titles and summaries from regulators and news sites can carry long unbroken
   words (references, URLs); they wrap rather than widen a phone screen. */
.pds-article, .pds-related { overflow-wrap: anywhere; }

/* Symbols: each opens the stock page (the global popup controller). */
.pds-symbols { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.pds-symbol {
    display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px;
    border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface);
    font-size: var(--public-type-caption); font-weight: 600; letter-spacing: 0.02em; color: var(--text-primary); text-decoration: none;
}
a.pds-symbol:hover { border-color: var(--portexa-primary-ink); color: var(--portexa-primary-ink); }

/* Editor controls on a row: icon buttons with names for screen readers. */
.pds-row-actions { display: inline-flex; gap: 4px; }
.pds-icon-btn {
    display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
    border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface);
    font-size: 12px; color: var(--text-secondary); text-decoration: none;
}
.pds-icon-btn:hover { border-color: var(--border-strong); color: var(--text-primary); }
.pds-icon-btn.is-danger:hover { border-color: var(--negative); color: var(--negative-ink); }

@container pds-news (max-width: 999px) {
    .pds-news, .pds-front { grid-template-columns: minmax(0, 1fr); }
    .pds-news__aside { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
}
@container pds-news (max-width: 599px) {
    .pds-desk { padding: 14px; gap: 12px; }
    form.pds-filter .pds-filter__wide { flex-basis: 100%; }
    form.pds-filter .pds-field { flex-basis: 8rem; }
    .pds-news-row { gap: 14px; }
    .pds-news-row__thumb { width: 88px; }
    .pds-notice { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .pds-notice__mark .pds-symbol { width: auto; }
    .pds-chip-row__label { min-width: 0; width: 100%; }
    .pds-front { gap: 20px; padding-bottom: 20px; }
}
@media (max-width: 1023px) {
    .pds-news, .pds-front { grid-template-columns: minmax(0, 1fr); }
}

/* Pagination. */
.pds-pages { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-top: 4px; font-size: var(--public-type-meta); color: var(--text-muted); }
.pds-pages b { font-weight: 600; color: var(--text-primary); font-variant-numeric: tabular-nums; }
.pds-pages ul { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; }
.pds-pages a, .pds-pages span {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 40px; height: 40px; padding: 0 12px;
    border-radius: var(--radius-md); font-size: var(--public-type-meta); font-weight: 600; font-variant-numeric: tabular-nums; text-decoration: none;
}
.pds-pages a { border: 1px solid var(--border); color: var(--text-secondary); background: var(--surface); }
.pds-pages a:hover { border-color: var(--border-strong); color: var(--text-primary); }
.pds-pages .cur { background: var(--portexa-primary-soft); color: var(--portexa-primary-ink); }
.pds-pages .gap { min-width: 24px; padding: 0; color: var(--text-muted); }

.pds-empty p + p { margin-top: 12px; }
.pds-empty__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.pds-empty__actions:empty { display: none; }

/* A story in full, beside more like it. */
.pds-back { margin-bottom: -16px; }
.pds-back a { display: inline-flex; align-items: center; gap: 8px; font-size: var(--public-type-card-text); font-weight: 600; color: var(--portexa-primary-ink); text-decoration: none; }
.pds-back a:hover { text-decoration: underline; text-underline-offset: 3px; }
.pds-article { display: grid; gap: 16px; min-width: 0; }
.pds-article__cover { margin: -8px -8px 4px; border-radius: var(--radius-md); overflow: hidden; background: var(--surface-soft); }
.pds-article__cover img { display: block; width: 100%; max-height: 420px; object-fit: cover; }
.pds-article__title { margin: 0; font-size: var(--public-type-article); font-weight: 800; line-height: 1.2; letter-spacing: -0.015em; color: var(--text-primary); }
.pds-article__lead { max-width: 68ch; font-size: var(--public-type-lead); line-height: 1.55; color: var(--text-body); }
.pds-article__meta { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 0; padding: 12px 0; list-style: none; border-top: 1px solid var(--border-row); border-bottom: 1px solid var(--border-row); font-size: var(--public-type-meta); color: var(--text-muted); }
.pds-article__meta li { display: inline-flex; align-items: center; gap: 8px; }
.pds-article__meta b { font-weight: 600; color: var(--text-primary); }
.pds-article__body { max-width: 70ch; font-size: var(--public-type-prose); line-height: 1.75; color: var(--text-secondary); }
.pds-article__body p + p { margin-top: 16px; }
.pds-article__after { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid var(--border-row); }
.pds-article__push { margin-left: auto; }
.pds-related { display: grid; margin: 0; padding: 0; list-style: none; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.pds-related li { display: grid; gap: 2px; padding: 14px 16px; }
.pds-related li + li { border-top: 1px solid var(--border-row); }
.pds-related a { font-size: var(--public-type-card-text); font-weight: 600; line-height: 1.4; color: var(--text-primary); text-decoration: none; }
.pds-related a:hover { color: var(--portexa-primary-ink); text-decoration: underline; text-underline-offset: 3px; }
.pds-related small { font-size: var(--public-type-caption); color: var(--text-muted); }

@media (max-width: 767px) {
    .pds-page--newsroom { --pds-page-gap: 20px; }
    .pds-filter__actions, .pds-filter__actions .pds-btn { flex: 1 1 auto; }
    .pds-article__push { margin-left: 0; }
    .pds-pages { justify-content: center; }
}

/* Spacing helpers used by the page templates (no inline styles). */
.pds-after-intro { margin-top: var(--pds-content-gap); }
.pds-block-gap { margin-top: var(--pds-content-gap); }
.pds-card__title { margin-top: 16px; }
.pds-card__text { margin: 8px 0 0; font-size: var(--public-type-card-text); line-height: 1.55; color: var(--text-body); }
.pds-mock__breadth i { display: block; height: 100%; }
.pds-table tbody th {
    height: 50px; padding: 0 16px; background: none;
    font-size: 14px; font-weight: 600; letter-spacing: 0; text-transform: none;
    color: var(--text-primary); border-bottom: 1px solid var(--border-row); white-space: nowrap;
}
.pds-table--compact tbody th { height: 40px; font-size: 13px; }
.pds-table tbody tr:last-child th { border-bottom: 0; }
.pds-after-point { margin-top: 14px; }
.pds-access .pds-card__text { margin-top: 0; }

/* Metric cards inside a product preview: smaller figures that may wrap. */
.pds-preview .pds-metric__value { font-size: 20px; white-space: normal; overflow: visible; }
.pds-preview .pds-metrics { grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); }
/* Anchor visually-hidden labels inside scrollers, so they cannot widen the page. */
.pds-table-wrap, .pds-mock, .pds-preview, .pds-pills { position: relative; }
.pds-article { align-items: start; }
.pds-item__aside { align-content: start; }

/* ==========================================================================
   Company · Founder's message (templates/website/founder.html)
   ========================================================================== */

.pds-founder { display: grid; grid-template-columns: minmax(0, 720px); justify-content: center; }

.pds-founder__letter { font-size: 18px; line-height: 1.75; }
.pds-founder__letter p { margin-bottom: 22px; }
.pds-founder__opening { font-size: 21px; line-height: 1.6; font-weight: 500; color: var(--text-primary); }
.pds-founder__opening::first-letter {
    float: left; margin: 6px 10px 0 0;
    font-size: 58px; line-height: 0.9; font-weight: 800; color: var(--portexa-primary-ink);
}
.pds-founder__line {
    padding-left: 18px; border-left: 3px solid var(--portexa-gold);
    font-size: 20px; font-weight: 600; line-height: 1.5; color: var(--text-primary);
}
.pds-founder__quote {
    position: relative; margin: 36px 0; padding: 28px 28px 28px 64px;
    background: var(--portexa-primary-soft); border-radius: var(--radius-lg);
}
.pds-founder__quote::before {
    content: '\201C'; position: absolute; left: 20px; top: 8px;
    font-size: 64px; line-height: 1; font-weight: 800; color: var(--portexa-primary-ink);
}
.pds-founder__quote p { margin: 0; font-size: 20px; line-height: 1.55; font-weight: 600; color: var(--text-primary); }
/* The letter's "Why Portexa" passage: company valuation, set apart. */
.pds-founder__why {
    margin: 36px 0; padding: 24px 28px;
    border: 1px solid var(--border); border-left: 4px solid var(--portexa-primary-ink); border-radius: var(--radius-lg);
    background: var(--surface-soft);
}
.pds-prose .pds-founder__why h3 { margin: 0 0 12px; font-size: 21px; line-height: 1.35; letter-spacing: -0.01em; }
.pds-founder__why p:last-child { margin-bottom: 0; }
.pds-founder-engines { padding-top: 0; }
.pds-founder__sign { display: flex; align-items: center; gap: 20px; margin-top: 44px; padding-top: 28px; border-top: 1px solid var(--border); }
.pds-founder__sign img {
    display: block; width: 88px; height: 88px; border-radius: 50%; object-fit: cover;
    border: 3px solid var(--surface); box-shadow: 0 0 0 1px var(--border), var(--pds-shadow-sm);
}
.pds-founder__sign div { display: flex; flex-direction: column; gap: 2px; line-height: 1.35; }
.pds-founder__sign b { font-size: 20px; font-weight: 700; letter-spacing: -0.01em; color: var(--text-primary); }
.pds-founder__sign span { font-size: 15px; font-weight: 500; color: var(--text-secondary); }
.pds-founder__sign span + span { font-size: 14px; font-weight: 400; color: var(--text-muted); }
.pds-founder__audience { justify-content: center; flex-wrap: wrap; margin-top: 36px; overflow: visible; }

@media (max-width: 767px) {
    .pds-founder__sign { gap: 16px; }
    .pds-founder__sign img { width: 72px; height: 72px; }
    .pds-founder__letter { font-size: 17px; }
    .pds-founder__opening { font-size: 19px; }
    .pds-founder__opening::first-letter { font-size: 48px; }
    .pds-founder__line, .pds-founder__quote p { font-size: 18px; }
    .pds-founder__quote { padding: 24px 20px 22px 52px; }
    .pds-founder__why { padding: 20px 18px; }
    .pds-prose .pds-founder__why h3 { font-size: 19px; }
    .pds-founder__quote::before { left: 14px; font-size: 52px; }
}