/* ==========================================================================
   RadGo public website — components
   Implements the Stitch design "RadGo - Enterprise Radiology Workflow & Reporting Platform".
   Values come from radgo-tokens.css; logical properties (inline/block) make the same rules
   serve English (LTR) and Arabic (RTL).
   ========================================================================== */

/* ---- Base ---------------------------------------------------------------- */
*,
*::before,
*::after { box-sizing: border-box; }

html {
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--radgo-header-height) + var(--radgo-space-md));
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    background: var(--radgo-surface);
    color: var(--radgo-text);
    font-family: var(--radgo-font-body);
    font-size: var(--radgo-text-body-md);
    line-height: var(--radgo-leading-body-md);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}

h1, h2, h3, h4, p, figure, blockquote, dl, dd { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
img, svg { display: block; max-width: 100%; }

:focus-visible {
    outline: none;
    box-shadow: var(--radgo-focus-ring);
    border-radius: var(--radgo-radius-md);
}

.rg-skip-link {
    position: fixed;
    inset-block-start: var(--radgo-space-sm);
    inset-inline-start: var(--radgo-space-sm);
    z-index: 100;
    padding: var(--radgo-space-sm) var(--radgo-space-md);
    border-radius: var(--radgo-radius-md);
    background: var(--radgo-primary);
    color: var(--radgo-on-primary);
    font-weight: var(--radgo-weight-semibold);
    transform: translateY(-200%);
    transition: transform var(--radgo-duration-fast) var(--radgo-ease);
}
.rg-skip-link:focus-visible { transform: none; }

.rg-main { display: block; padding-block-start: var(--radgo-header-height); outline: none; }

/* ---- Icons (Material Symbols subset) ------------------------------------- */
.rg-icon {
    font-family: "Material Symbols Outlined";
    font-weight: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    direction: ltr;
    display: inline-block;
    flex-shrink: 0;
    font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
    overflow: hidden;
    font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}
.rg-icon--14 { font-size: 14px; width: 14px; height: 14px; }
.rg-icon--16 { font-size: 16px; width: 16px; height: 16px; }
.rg-icon--18 { font-size: 18px; width: 18px; height: 18px; }
.rg-icon--20 { font-size: 20px; width: 20px; height: 20px; }
.rg-icon--22 { font-size: 22px; width: 22px; height: 22px; }
.rg-icon--24 { font-size: 24px; width: 24px; height: 24px; }
.rg-icon--32 { font-size: 32px; width: 32px; height: 32px; }
.rg-icon--36 { font-size: 36px; width: 36px; height: 36px; }
.rg-icon--64 { font-size: 64px; width: 64px; height: 64px; font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 48; }
.rg-icon--filled { font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24; }
[dir="rtl"] .rg-icon--directional { transform: scaleX(-1); }

/* ---- Utilities used inside compositions ---------------------------------- */
.rg-accent-text { color: var(--radgo-accent); }
.rg-accent-dim-text { color: var(--radgo-accent); }
.rg-bright-text { color: var(--radgo-accent-bright); }
.rg-danger-text { color: var(--radgo-danger); }
.rg-muted { color: var(--radgo-text-muted); }
.rg-text { color: var(--radgo-text); }
.rg-strong { font-weight: var(--radgo-weight-bold); }
.rg-semibold { font-weight: var(--radgo-weight-semibold); }
.rg-mono {
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-medium);
}
.rg-mono.rg-strong { font-weight: var(--radgo-weight-bold); }

.rg-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: var(--radgo-radius-full);
    background: var(--radgo-accent);
    flex-shrink: 0;
}
.rg-dot--lg { width: 12px; height: 12px; }
.rg-dot--bright { background: var(--radgo-accent-soft); }
.rg-dot--muted { background: var(--radgo-border); }
.rg-dot--pulse { width: 6px; height: 6px; animation: rg-pulse 2s var(--radgo-ease) infinite; }

.rg-ping { position: relative; display: inline-flex; width: 8px; height: 8px; flex-shrink: 0; }
.rg-ping__wave,
.rg-ping__dot { position: absolute; inset: 0; border-radius: var(--radgo-radius-full); background: var(--radgo-accent); }
.rg-ping__wave { opacity: 0.75; animation: rg-ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; }

@keyframes rg-ping { 75%, 100% { transform: scale(2); opacity: 0; } }
@keyframes rg-pulse { 50% { opacity: 0.5; } }

.rg-code-chip {
    display: inline-block;
    padding: var(--radgo-space-2xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-xs);
    background: var(--radgo-surface-high);
    color: var(--radgo-text-muted);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-medium);
}

/* ---- Layout -------------------------------------------------------------- */
.rg-container {
    width: 100%;
    max-width: var(--radgo-width-page);
    margin-inline: auto;
}
.rg-container--narrow { max-width: var(--radgo-width-narrow); }

.rg-section {
    position: relative;
    padding: var(--radgo-space-section) var(--radgo-margin-desktop);
    background: var(--radgo-surface);
}
.rg-section--alt { background: var(--radgo-surface-alt); }
.rg-section--tinted { background: var(--radgo-surface-container); padding-block: var(--radgo-space-section-sm); }
.rg-section--navy { background: var(--radgo-primary); color: var(--radgo-on-primary); overflow: hidden; }

.rg-grid { display: grid; gap: var(--radgo-space-lg); grid-template-columns: 1fr; }
.rg-grid--tight { gap: var(--radgo-space-md); }

/* ---- Buttons ------------------------------------------------------------- */
.rg-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--radgo-space-xs);
    padding: var(--radgo-space-sm) var(--radgo-space-md);
    border-radius: var(--radgo-radius-md);
    font-size: var(--radgo-text-label-md);
    line-height: var(--radgo-leading-label-md);
    letter-spacing: var(--radgo-tracking-label-md);
    font-weight: var(--radgo-weight-medium);
    white-space: nowrap;
    transition: background-color var(--radgo-duration-fast) var(--radgo-ease), color var(--radgo-duration-fast) var(--radgo-ease), box-shadow var(--radgo-duration-fast) var(--radgo-ease);
}
.rg-button--compact { padding: var(--radgo-space-sm) var(--radgo-space-md); }
.rg-button--large {
    padding: var(--radgo-space-3) var(--radgo-space-xl);
    font-size: var(--radgo-text-label-lg);
    line-height: var(--radgo-leading-label-lg);
    letter-spacing: 0;
    font-weight: var(--radgo-weight-semibold);
}
.rg-button--small { gap: var(--radgo-space-sm); padding: var(--radgo-space-sm) var(--radgo-space-md); font-weight: var(--radgo-weight-bold); }
.rg-button--block { width: 100%; padding-block: var(--radgo-space-3); font-size: var(--radgo-text-label-lg); }
.rg-button--primary { background: var(--radgo-primary); color: var(--radgo-on-primary); box-shadow: var(--radgo-shadow-md); }
.rg-button--primary:hover { background: var(--radgo-primary-dark); }
.rg-button--ink { background: var(--radgo-primary-dark); color: var(--radgo-on-primary); box-shadow: var(--radgo-shadow-md); padding-inline: var(--radgo-space-lg); }
.rg-button--ink:hover { background: var(--radgo-primary); }
.rg-button--light { background: var(--radgo-surface-raised); color: var(--radgo-text); box-shadow: var(--radgo-shadow-sm); }
.rg-button--light:hover { background: var(--radgo-surface-container); }
.rg-button--accent { background: var(--radgo-accent); color: var(--radgo-on-accent); box-shadow: var(--radgo-shadow-sm); }
.rg-button--accent.rg-button--large { box-shadow: var(--radgo-shadow-xl); padding-block: 14px; font-weight: var(--radgo-weight-bold); gap: var(--radgo-space-sm); }
.rg-button--accent:hover { background: var(--radgo-accent-ink); }
.rg-button--glass { background: var(--radgo-glass-on-dark); color: var(--radgo-on-primary); box-shadow: var(--radgo-shadow-sm); padding-block: 14px; gap: var(--radgo-space-sm); }
.rg-button--glass:hover { background: var(--radgo-glass-on-dark-hover); }
.rg-button__nudge { transition: transform var(--radgo-duration-fast) var(--radgo-ease); }
.rg-button:hover .rg-button__nudge { transform: translateX(2px); }
[dir="rtl"] .rg-button:hover .rg-button__nudge { transform: scaleX(-1) translateX(2px); }

/* ---- Header -------------------------------------------------------------- */
.rg-header {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 50;
    box-shadow: var(--radgo-shadow-lg);
    border-block-end: 1px solid var(--radgo-border-soft);
}
/* The frosted surface lives on a pseudo-element: a backdrop-filter on the header itself would
   become the containing block of the fixed mobile drawer and clip it to the header bar. */
.rg-header::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--radgo-header-bg);
    -webkit-backdrop-filter: blur(24px);
    backdrop-filter: blur(24px);
}
.rg-header__wash {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(to right, var(--radgo-accent-wash), transparent, var(--radgo-accent-wash-end));
}
.rg-header__rule {
    position: absolute;
    inset: auto 0 0 0;
    height: 1px;
    background: linear-gradient(to right, transparent, var(--radgo-accent-line), transparent);
}
.rg-header__bar {
    position: relative;
    z-index: 1;
    height: var(--radgo-header-height);
    padding-inline: var(--radgo-margin-desktop);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--radgo-space-lg);
}
.rg-header__brand { display: flex; align-items: center; gap: var(--radgo-space-lg); flex-shrink: 0; }
.rg-header__badge {
    display: none;
    align-items: center;
    padding: var(--radgo-space-xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-full);
    background: var(--radgo-accent-soft);
    color: var(--radgo-accent-ink);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-medium);
    text-transform: uppercase;
    letter-spacing: var(--radgo-tracking-wide);
    white-space: nowrap;
}
.rg-header__actions { display: flex; align-items: center; gap: var(--radgo-space-md); }
.rg-header__signin,
.rg-header__avatar,
.rg-header__lang { display: none; }
.rg-header__avatar {
    width: 32px;
    height: 32px;
    border-radius: var(--radgo-radius-full);
    background: var(--radgo-primary-dark);
    color: var(--radgo-on-primary);
    align-items: center;
    justify-content: center;
    box-shadow: var(--radgo-shadow-sm);
}

.rg-logo { display: inline-flex; align-items: center; gap: var(--radgo-space-sm); color: var(--radgo-text); }
.rg-logo__mark { width: 32px; height: 32px; flex-shrink: 0; }
.rg-logo__tile { fill: var(--radgo-logo-navy); }
.rg-logo__arc { stroke: var(--radgo-logo-teal); stroke-width: 2.5; stroke-linecap: round; fill: none; }
.rg-logo__beam { stroke: var(--radgo-logo-cyan); stroke-width: 2.5; stroke-linecap: round; fill: none; }
.rg-logo__node { fill: var(--radgo-logo-cyan); }
.rg-logo__dot { fill: var(--radgo-logo-teal); }
.rg-logo__word {
    font-family: "Plus Jakarta Sans", "Inter", system-ui, sans-serif;
    font-size: var(--radgo-text-headline-sm);
    line-height: var(--radgo-leading-headline-sm);
    font-weight: var(--radgo-weight-bold);
    letter-spacing: var(--radgo-tracking-tight);
}
.rg-logo__go { color: var(--radgo-accent); }

.rg-nav { display: none; align-items: center; gap: var(--radgo-space-xs); }
.rg-nav__link {
    padding: var(--radgo-space-xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-md);
    color: var(--radgo-text-muted);
    font-size: var(--radgo-text-label-md);
    line-height: var(--radgo-leading-label-md);
    letter-spacing: var(--radgo-tracking-label-md);
    font-weight: var(--radgo-weight-medium);
    white-space: nowrap;
    transition: background-color var(--radgo-duration-fast) var(--radgo-ease), color var(--radgo-duration-fast) var(--radgo-ease);
}
.rg-nav__link:hover { color: var(--radgo-text); background: var(--radgo-surface-high); }
.rg-nav__link.is-active { background: var(--radgo-primary); color: var(--radgo-on-primary); box-shadow: var(--radgo-shadow-sm); }

.rg-lang-toggle {
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-xs);
    padding: var(--radgo-space-xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-md);
    background: var(--radgo-surface-container);
    color: var(--radgo-text);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    font-weight: var(--radgo-weight-semibold);
    white-space: nowrap;
    transition: background-color var(--radgo-duration-fast) var(--radgo-ease);
}
.rg-lang-toggle:hover { background: var(--radgo-surface-high); }
.rg-lang-toggle__sep { color: var(--radgo-border); }
.rg-lang-toggle__other { color: var(--radgo-accent); font-weight: var(--radgo-weight-medium); }
.rg-lang-toggle__current { color: var(--radgo-text); }

.rg-menu-button,
.rg-icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radgo-radius-md);
    color: var(--radgo-text);
    background: var(--radgo-surface-container);
}
.rg-menu-button:hover,
.rg-icon-button:hover { background: var(--radgo-surface-high); }

.rg-drawer { position: fixed; inset: 0; z-index: 60; }
.rg-drawer[hidden] { display: none; }
.rg-drawer__backdrop { position: absolute; inset: 0; background: var(--radgo-scrim); }
.rg-drawer__panel {
    position: absolute;
    inset-block: 0;
    inset-inline-end: 0;
    width: min(360px, 100%);
    display: flex;
    flex-direction: column;
    gap: var(--radgo-space-lg);
    padding: var(--radgo-space-md) var(--radgo-margin-desktop) var(--radgo-space-xl);
    background: var(--radgo-surface);
    box-shadow: var(--radgo-shadow-2xl);
    overflow-y: auto;
    animation: rg-drawer-in var(--radgo-duration) var(--radgo-ease);
}
[dir="rtl"] .rg-drawer__panel { animation-name: rg-drawer-in-rtl; }
@keyframes rg-drawer-in { from { transform: translateX(100%); } }
@keyframes rg-drawer-in-rtl { from { transform: translateX(-100%); } }
.rg-drawer__head { display: flex; align-items: center; justify-content: space-between; min-height: 48px; }
.rg-drawer__nav { display: flex; flex-direction: column; gap: var(--radgo-space-xs); }
.rg-drawer__link {
    padding: var(--radgo-space-3) var(--radgo-space-md);
    border-radius: var(--radgo-radius-lg);
    font-size: var(--radgo-text-body-lg);
    line-height: var(--radgo-leading-body-lg);
    font-weight: var(--radgo-weight-semibold);
    color: var(--radgo-text);
}
.rg-drawer__link:hover { background: var(--radgo-surface-container); }
.rg-drawer__actions { display: flex; flex-direction: column; gap: var(--radgo-space-sm); margin-block-start: auto; }
.rg-drawer__actions .rg-lang-toggle { align-self: flex-start; padding: var(--radgo-space-sm) var(--radgo-space-md); font-size: var(--radgo-text-label-lg); line-height: var(--radgo-leading-label-lg); }
body.rg-no-scroll { overflow: hidden; }

/* Floating language pill (Stitch bottom utility) */
.rg-lang-pill {
    position: fixed;
    inset-block-end: var(--radgo-space-lg);
    inset-inline-end: var(--radgo-space-lg);
    z-index: 40;
    display: flex;
    align-items: center;
    gap: var(--radgo-space-xs);
    padding: 6px;
    border-radius: var(--radgo-radius-full);
    background: var(--radgo-pill-bg);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    box-shadow: var(--radgo-shadow-xl);
}
.rg-lang-pill__option {
    padding: var(--radgo-space-xs) var(--radgo-space-md);
    border-radius: var(--radgo-radius-full);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    font-weight: var(--radgo-weight-semibold);
    color: var(--radgo-text);
    transition: color var(--radgo-duration-fast) var(--radgo-ease);
}
.rg-lang-pill__option:hover { color: var(--radgo-accent); }
.rg-lang-pill__option.is-active { background: var(--radgo-primary-dark); color: var(--radgo-on-primary); box-shadow: var(--radgo-shadow-sm); }

/* ---- Section heading, tags, pills ---------------------------------------- */
.rg-heading { max-width: var(--radgo-width-copy); margin-block-end: var(--radgo-space-xl); text-align: start; }
.rg-heading--center { margin-inline: auto; text-align: center; }
.rg-eyebrow {
    display: block;
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-bold);
    letter-spacing: var(--radgo-tracking-widest);
    text-transform: uppercase;
    color: var(--radgo-accent);
}
:lang(ar) .rg-eyebrow { font-family: var(--radgo-font-body); font-size: var(--radgo-text-label-lg); line-height: var(--radgo-leading-label-lg); }
.rg-heading__title,
.rg-showcase__title,
.rg-step-panel__title {
    font-family: var(--radgo-font-display);
    font-size: var(--radgo-text-headline-lg);
    line-height: var(--radgo-leading-headline-lg);
    letter-spacing: var(--radgo-tracking-headline-lg);
    font-weight: var(--radgo-weight-bold);
    color: var(--radgo-text);
}
.rg-heading__title { margin-block: var(--radgo-space-xs) var(--radgo-space-sm); }
.rg-heading__lede,
.rg-showcase__lede,
.rg-step-panel__lede {
    font-size: var(--radgo-text-body-lg);
    line-height: var(--radgo-leading-body-lg);
    color: var(--radgo-text-muted);
}
.rg-heading--dark .rg-eyebrow { color: var(--radgo-accent-bright); }
.rg-heading--dark .rg-heading__title { color: var(--radgo-on-primary); }
.rg-heading--dark .rg-heading__lede { color: var(--radgo-surface-dim); }

.rg-tag {
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-sm);
    align-self: flex-start;
    padding: var(--radgo-space-xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-xs);
    border: 1px solid var(--radgo-border-soft);
    background: var(--radgo-surface-high);
    color: var(--radgo-accent);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-bold);
    text-transform: uppercase;
}
:lang(ar) .rg-tag { font-family: var(--radgo-font-body); }
.rg-tag--inline { flex-shrink: 0; }

.rg-pill {
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-sm);
    padding: var(--radgo-space-xs) var(--radgo-space-md);
    border-radius: var(--radgo-radius-full);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
}
:lang(ar) .rg-pill { font-family: var(--radgo-font-body); font-weight: var(--radgo-weight-semibold); }
.rg-pill--glass { background: var(--radgo-glass-on-dark); color: var(--radgo-accent-soft); }

/* ---- Hero ---------------------------------------------------------------- */
.rg-hero {
    position: relative;
    overflow: hidden;
    padding: var(--radgo-space-xl) var(--radgo-margin-desktop) var(--radgo-space-section);
    background: linear-gradient(to bottom, var(--radgo-surface), var(--radgo-surface-alt), var(--radgo-surface));
}
.rg-hero__glow { position: absolute; border-radius: var(--radgo-radius-full); pointer-events: none; }
.rg-hero__glow--top {
    inset-block-start: -128px;
    inset-inline-start: 50%;
    width: 900px;
    height: 500px;
    transform: translateX(-50%);
    background: var(--radgo-glow-accent);
    filter: blur(130px);
}
[dir="rtl"] .rg-hero__glow--top { transform: translateX(50%); }
.rg-hero__glow--side {
    inset-block-start: 384px;
    inset-inline-start: -96px;
    width: 400px;
    height: 400px;
    background: var(--radgo-glow-tint);
    filter: blur(100px);
}
.rg-hero__inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; }
.rg-hero__pill {
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-xs);
    padding: var(--radgo-space-xs) var(--radgo-space-md);
    margin-block-end: var(--radgo-space-lg);
    border-radius: var(--radgo-radius-full);
    border: 1px solid var(--radgo-border-soft);
    background: var(--radgo-surface-raised);
    box-shadow: var(--radgo-shadow-sm);
    color: var(--radgo-accent);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-bold);
    letter-spacing: var(--radgo-tracking-wider);
    text-transform: uppercase;
}
:lang(ar) .rg-hero__pill { font-family: var(--radgo-font-body); font-size: var(--radgo-text-label-lg); line-height: var(--radgo-leading-label-lg); }
.rg-hero__title {
    max-width: var(--radgo-width-narrow);
    margin-block-end: var(--radgo-space-md);
    font-family: var(--radgo-font-display);
    font-size: var(--radgo-text-display);
    line-height: var(--radgo-leading-display);
    letter-spacing: var(--radgo-tracking-display);
    font-weight: var(--radgo-weight-bold);
    color: var(--radgo-text);
    text-wrap: balance;
}
.rg-hero__lede {
    max-width: var(--radgo-width-lede);
    margin-block-end: var(--radgo-space-xl);
    font-size: var(--radgo-text-body-lg);
    line-height: var(--radgo-leading-body-lg);
    color: var(--radgo-text-muted);
}
.rg-hero__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--radgo-space-md); margin-block-end: var(--radgo-space-lg); }
.rg-hero__trust {
    display: flex;
    align-items: center;
    gap: var(--radgo-space-xs);
    margin-block-end: var(--radgo-space-xl);
    color: var(--radgo-text-muted);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    letter-spacing: var(--radgo-tracking-label-sm);
    font-weight: var(--radgo-weight-semibold);
    text-align: start;
}
.rg-hero__stage { position: relative; width: 100%; margin-block-start: var(--radgo-space-md); }

/* ---- Device frames -------------------------------------------------------- */
.rg-device { margin: 0; text-align: start; }
.rg-device--window {
    width: 100%;
    overflow: hidden;
    border-radius: var(--radgo-radius-xl);
    background: var(--radgo-surface-raised);
    box-shadow: var(--radgo-shadow-xl);
}
.rg-device__titlebar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--radgo-space-md);
    padding: var(--radgo-space-3) var(--radgo-space-lg);
    background: var(--radgo-surface-alt);
}
.rg-device__lights { display: flex; align-items: center; gap: var(--radgo-space-sm); min-width: 0; }
.rg-device__light { width: 12px; height: 12px; border-radius: var(--radgo-radius-full); background: var(--radgo-border); flex-shrink: 0; }
.rg-device__light--close { background: var(--radgo-danger-dot); }
.rg-device__light--go { background: var(--radgo-accent-dim); }
.rg-device__title {
    margin-inline-start: var(--radgo-space-sm);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-medium);
    color: var(--radgo-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
:lang(ar) .rg-device__title { font-family: var(--radgo-font-body); }

/* Hero worklist window */
.rg-worklist__status {
    display: flex;
    align-items: center;
    gap: var(--radgo-space-md);
    color: var(--radgo-text-muted);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    font-weight: var(--radgo-weight-semibold);
    white-space: nowrap;
}
.rg-worklist__nodes { display: inline-flex; align-items: center; gap: var(--radgo-space-xs); }
.rg-worklist__filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--radgo-space-sm);
    padding: var(--radgo-space-2) var(--radgo-space-lg);
    background: var(--radgo-surface-container);
}
.rg-worklist__chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--radgo-space-xs); }
.rg-filter-chip {
    padding: var(--radgo-space-xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-xs);
    background: var(--radgo-surface-raised);
    color: var(--radgo-text-muted);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    font-weight: var(--radgo-weight-semibold);
    white-space: nowrap;
}
.rg-filter-chip.is-active { background: var(--radgo-primary); color: var(--radgo-on-primary); }
.rg-worklist__due {
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-xs);
    color: var(--radgo-danger);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    font-weight: var(--radgo-weight-semibold);
}
.rg-worklist__scroll { overflow-x: auto; }
.rg-worklist__table {
    width: 100%;
    border-collapse: collapse;
    text-align: start;
    font-size: var(--radgo-text-body-sm);
    line-height: var(--radgo-leading-body-sm);
    color: var(--radgo-text);
}
.rg-worklist__table thead {
    background: var(--radgo-surface-alt);
    color: var(--radgo-text-muted);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    letter-spacing: var(--radgo-tracking-wider);
    text-transform: uppercase;
}
.rg-worklist__table th { font-weight: var(--radgo-weight-semibold); text-align: start; white-space: nowrap; }
.rg-worklist__table th,
.rg-worklist__table td { padding: var(--radgo-space-3) var(--radgo-space-md); }
.rg-worklist__table td { white-space: nowrap; }
.rg-worklist__table tbody tr { background: var(--radgo-surface-raised); border-block-start: 1px solid var(--radgo-surface-alt); }
.rg-worklist__table tbody tr.is-urgent { background: var(--radgo-row-danger); }

.rg-modality,
.rg-priority {
    display: inline-block;
    padding: var(--radgo-space-2xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-xs);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    font-weight: var(--radgo-weight-medium);
    white-space: nowrap;
}
.rg-modality { font-family: var(--radgo-font-mono); font-size: var(--radgo-text-code); line-height: var(--radgo-leading-code); font-weight: var(--radgo-weight-bold); background: var(--radgo-surface-highest); color: var(--radgo-text); }
.rg-modality--dark { background: var(--radgo-primary); color: var(--radgo-on-primary); }
.rg-priority { background: var(--radgo-surface-container); color: var(--radgo-text-muted); }
.rg-priority--stat { background: var(--radgo-danger); color: var(--radgo-on-danger); font-weight: var(--radgo-weight-bold); text-transform: uppercase; }
.rg-priority--quiet { background: var(--radgo-surface-alt); }
.rg-priority--lg { padding: var(--radgo-space-xs) var(--radgo-space-sm); font-family: var(--radgo-font-mono); font-size: var(--radgo-text-code); line-height: var(--radgo-leading-code); font-weight: var(--radgo-weight-bold); flex-shrink: 0; }
:lang(ar) .rg-priority--lg { font-family: var(--radgo-font-body); }
.rg-priority--routine { background: var(--radgo-surface-highest); color: var(--radgo-text-muted); text-transform: uppercase; }

.rg-person { display: inline-flex; align-items: center; gap: var(--radgo-space-sm); }
.rg-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: var(--radgo-radius-full);
    color: var(--radgo-on-accent);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-micro);
    font-weight: var(--radgo-weight-bold);
    flex-shrink: 0;
}
.rg-avatar--accent { background: var(--radgo-accent); }
.rg-avatar--tint { background: var(--radgo-tint); }
.rg-avatar--ink { background: var(--radgo-primary); }

.rg-status {
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-xs);
    padding: var(--radgo-space-2xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-full);
    background: var(--radgo-surface-container);
    color: var(--radgo-text-muted);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    font-weight: var(--radgo-weight-medium);
    white-space: nowrap;
}
.rg-status--live { background: var(--radgo-accent-soft); color: var(--radgo-accent-ink); }
.rg-status--ready { color: var(--radgo-accent-ink); }

/* Hero overlays */
.rg-float-viewer,
.rg-toast { display: none; }
.rg-device--panel.rg-device--dark { background: var(--radgo-primary); color: var(--radgo-on-primary); }
.rg-float-viewer {
    position: absolute;
    z-index: 2;
    inset-block-end: -40px;
    inset-inline-end: var(--radgo-space-xl);
    width: var(--radgo-width-floating-viewer);
    flex-direction: column;
    padding: var(--radgo-space-md);
    border-radius: var(--radgo-radius-lg);
    box-shadow: var(--radgo-shadow-2xl);
}
.rg-float-viewer__head { display: flex; align-items: center; justify-content: space-between; margin-block-end: var(--radgo-space-sm); gap: var(--radgo-space-sm); }
.rg-float-viewer__title {
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-sm);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-bold);
    color: var(--radgo-accent-bright);
}
:lang(ar) .rg-float-viewer__title { font-family: var(--radgo-font-body); }
.rg-float-viewer__meta { font-family: var(--radgo-font-mono); font-size: var(--radgo-text-micro); color: var(--radgo-surface-dim); }
.rg-float-viewer__canvas {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 192px;
    overflow: hidden;
    border-radius: var(--radgo-radius-xs);
    background: var(--radgo-viewer);
}
.rg-float-viewer__overlay {
    position: absolute;
    inset-block-start: var(--radgo-space-sm);
    left: var(--radgo-space-sm);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-micro);
    line-height: var(--radgo-leading-micro);
    color: var(--radgo-surface-dim);
    text-align: left;
}
.rg-float-viewer__flag {
    position: absolute;
    inset-block-end: var(--radgo-space-sm);
    right: var(--radgo-space-sm);
    padding: var(--radgo-space-2xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-xs);
    background: var(--radgo-accent);
    color: var(--radgo-on-accent);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-micro);
    font-weight: var(--radgo-weight-bold);
}
.rg-float-viewer__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--radgo-space-sm);
    margin-block-start: var(--radgo-space-2);
    color: var(--radgo-surface-dim);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    font-weight: var(--radgo-weight-semibold);
}
.rg-float-viewer__session { display: inline-flex; align-items: center; gap: var(--radgo-space-xs); }
.rg-float-viewer__session .rg-icon { color: var(--radgo-accent-soft); }
.rg-float-viewer__tools { color: var(--radgo-accent-bright); font-family: var(--radgo-font-mono); font-size: var(--radgo-text-micro); }
:lang(ar) .rg-float-viewer__tools { font-family: var(--radgo-font-body); font-size: var(--radgo-text-label-sm); }

.rg-toast {
    position: absolute;
    z-index: 2;
    inset-block-end: -24px;
    inset-inline-start: -24px;
    max-width: var(--radgo-width-note);
    align-items: center;
    gap: var(--radgo-space-md);
    padding: var(--radgo-space-md);
    border-radius: var(--radgo-radius-lg);
    background: var(--radgo-surface-raised);
    box-shadow: var(--radgo-shadow-xl);
}
.rg-toast .rg-device__screen { display: contents; }
.rg-toast__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radgo-radius-full);
    background: var(--radgo-accent-soft);
    color: var(--radgo-accent-ink);
    flex-shrink: 0;
}
.rg-toast__title {
    display: flex;
    align-items: center;
    gap: var(--radgo-space-sm);
    font-size: var(--radgo-text-label-md);
    line-height: var(--radgo-leading-label-md);
    font-weight: var(--radgo-weight-bold);
    color: var(--radgo-text);
}
.rg-toast__when { font-family: var(--radgo-font-mono); font-size: var(--radgo-text-micro); font-weight: var(--radgo-weight-bold); color: var(--radgo-accent); }
:lang(ar) .rg-toast__when { font-family: var(--radgo-font-body); font-size: var(--radgo-text-label-sm); }
.rg-toast__text { font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }

/* ---- Trust strip & metrics ----------------------------------------------- */
.rg-trust { padding-block: var(--radgo-space-xl); }
.rg-trust__title {
    margin-block-end: var(--radgo-space-lg);
    text-align: center;
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    letter-spacing: var(--radgo-tracking-wider);
    font-weight: var(--radgo-weight-bold);
    text-transform: uppercase;
    color: var(--radgo-text-muted);
}
.rg-trust__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--radgo-space-lg);
    align-items: center;
    justify-items: center;
    margin-block-end: var(--radgo-space-xl);
    opacity: 0.85;
}
.rg-trust-item {
    display: flex;
    align-items: center;
    gap: var(--radgo-space-sm);
    font-family: var(--radgo-font-display);
    font-size: var(--radgo-text-headline-sm);
    line-height: var(--radgo-leading-headline-sm);
    font-weight: var(--radgo-weight-bold);
    letter-spacing: -0.05em;
    color: var(--radgo-text);
    text-align: center;
}
:lang(ar) .rg-trust-item { letter-spacing: 0; }
.rg-trust-item .rg-icon { color: var(--radgo-accent); }
.rg-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--radgo-space-md); }
.rg-metric { padding: var(--radgo-space-lg); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-raised); box-shadow: var(--radgo-shadow-sm); }
.rg-metric__value {
    margin-block-end: var(--radgo-space-xs);
    font-family: var(--radgo-font-display);
    font-size: var(--radgo-text-headline-lg);
    line-height: var(--radgo-leading-headline-lg);
    letter-spacing: var(--radgo-tracking-display);
    font-weight: var(--radgo-weight-bold);
    color: var(--radgo-text);
    overflow-wrap: break-word;
}
.rg-metric__value--accent { color: var(--radgo-accent); }
.rg-metric__label { font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-metric__text { margin-block-start: var(--radgo-space-xs); font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }

/* ---- Lifecycle rail ------------------------------------------------------ */
.rg-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--radgo-space-sm); margin-block-end: var(--radgo-space-lg); }
.rg-step {
    display: block;
    padding: var(--radgo-space-md);
    border-radius: var(--radgo-radius-lg);
    background: var(--radgo-surface-container);
    color: var(--radgo-text);
    text-align: start;
    transition: background-color var(--radgo-duration-fast) var(--radgo-ease), box-shadow var(--radgo-duration-fast) var(--radgo-ease);
}
.rg-step:hover { background: var(--radgo-surface-high); }
.rg-step.is-selected { background: var(--radgo-primary); color: var(--radgo-on-primary); box-shadow: var(--radgo-shadow-md); }
.rg-step__phase {
    display: block;
    margin-block-end: var(--radgo-space-xs);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-medium);
    color: var(--radgo-text-muted);
}
:lang(ar) .rg-step__phase { font-family: var(--radgo-font-body); }
.rg-step.is-selected .rg-step__phase { color: var(--radgo-accent-soft); }
.rg-step__name {
    display: block;
    font-family: var(--radgo-font-display);
    font-size: var(--radgo-text-headline-sm);
    line-height: var(--radgo-leading-headline-sm);
    letter-spacing: var(--radgo-tracking-headline-sm);
    font-weight: var(--radgo-weight-bold);
}
.rg-step-panel {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--radgo-space-lg);
    align-items: center;
    padding: var(--radgo-space-xl);
    border-radius: var(--radgo-radius-xl);
    background: var(--radgo-surface-raised);
    box-shadow: var(--radgo-shadow-lg);
}
.rg-step-panel[hidden] { display: none; }
.rg-step-panel__copy { display: flex; flex-direction: column; gap: var(--radgo-space-md); }
.rg-step-panel__kicker { display: flex; flex-wrap: wrap; align-items: center; gap: var(--radgo-space-sm); }
.rg-step-panel__phase {
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-bold);
    text-transform: uppercase;
    color: var(--radgo-accent);
}
:lang(ar) .rg-step-panel__phase,
:lang(ar) .rg-code-chip { font-family: var(--radgo-font-body); }
.rg-step-panel__stats { display: grid; grid-template-columns: 1fr; gap: var(--radgo-space-sm); padding-block-start: var(--radgo-space-xs); }
.rg-step-stat { display: flex; flex-direction: column; padding: var(--radgo-space-3); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-alt); }
.rg-step-stat__value {
    order: -1;
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-bold);
    color: var(--radgo-accent);
}
:lang(ar) .rg-step-stat__value { font-family: var(--radgo-font-body); font-size: var(--radgo-text-label-lg); line-height: var(--radgo-leading-label-lg); }
.rg-step-stat__label { font-size: var(--radgo-text-caption); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }
.rg-step-panel__aside {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--radgo-space-3);
    padding: var(--radgo-space-lg);
    border-radius: var(--radgo-radius-lg);
    background: var(--radgo-surface-alt);
    box-shadow: var(--radgo-shadow-inner);
    text-align: center;
}
.rg-step-panel__check { font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-step-panel__note { max-width: 320px; font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }

/* ---- Product showcase ---------------------------------------------------- */
.rg-product__stack { display: flex; flex-direction: column; gap: var(--radgo-space-section); }
.rg-showcase { display: grid; grid-template-columns: 1fr; gap: var(--radgo-space-xl); align-items: center; scroll-margin-top: calc(var(--radgo-header-height) + var(--radgo-space-md)); }
.rg-showcase__copy,
.rg-mobile__copy,
.rg-band__copy { display: flex; flex-direction: column; gap: var(--radgo-space-md); text-align: start; }
.rg-showcase__visual { min-width: 0; }
.rg-checklist { display: flex; flex-direction: column; gap: var(--radgo-space-sm); font-size: var(--radgo-text-body-md); line-height: var(--radgo-leading-body-md); color: var(--radgo-text); }
.rg-checklist li { display: flex; align-items: center; gap: var(--radgo-space-xs); }
.rg-checklist--compact { gap: var(--radgo-space-xs); font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }
.rg-checklist--compact li { gap: var(--radgo-space-sm); }
.rg-mini-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--radgo-space-sm); padding-block-start: var(--radgo-space-xs); }
.rg-mini-stat { display: flex; flex-direction: column; padding: var(--radgo-space-3); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-raised); box-shadow: var(--radgo-shadow-sm); }
.rg-mini-stat__title { font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-mini-stat__text { font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }
.rg-inline-checks { display: flex; flex-wrap: wrap; align-items: center; gap: var(--radgo-space-md); font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-inline-checks li { display: inline-flex; align-items: center; gap: var(--radgo-space-xs); }

/* Panels (queue, report, channels) */
.rg-panel {
    padding: var(--radgo-space-lg);
    border-radius: var(--radgo-radius-xl);
    background: var(--radgo-surface-raised);
    box-shadow: var(--radgo-shadow-md);
}
.rg-panel .rg-device__screen { display: flex; flex-direction: column; gap: var(--radgo-space-md); }
.rg-panel__head { display: flex; align-items: center; justify-content: space-between; gap: var(--radgo-space-sm); flex-wrap: wrap; }
.rg-panel__title {
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-sm);
    font-size: var(--radgo-text-label-md);
    line-height: var(--radgo-leading-label-md);
    font-weight: var(--radgo-weight-bold);
    color: var(--radgo-text);
}
.rg-panel__title--lg { font-family: var(--radgo-font-display); font-size: var(--radgo-text-headline-sm); line-height: var(--radgo-leading-headline-sm); }
.rg-alert-chip {
    padding: var(--radgo-space-2xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-xs);
    background: var(--radgo-danger-soft);
    color: var(--radgo-danger-ink);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-bold);
}
:lang(ar) .rg-alert-chip { font-family: var(--radgo-font-body); }
.rg-queue { display: flex; flex-direction: column; gap: var(--radgo-space-sm); }
.rg-queue__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--radgo-space-3);
    padding: var(--radgo-space-3);
    border-radius: var(--radgo-radius-md);
    background: var(--radgo-surface-alt);
    transition: background-color var(--radgo-duration-fast) var(--radgo-ease);
}
.rg-queue__row:hover { background: var(--radgo-surface-container); }
.rg-queue__main { display: flex; align-items: center; gap: var(--radgo-space-3); min-width: 0; }
.rg-queue__title { display: block; font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-queue__meta { font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }
.rg-queue__time { display: flex; flex-direction: column; align-items: flex-end; text-align: end; flex-shrink: 0; }
.rg-queue__target { font-size: var(--radgo-text-label-sm); line-height: var(--radgo-leading-label-sm); color: var(--radgo-text-muted); }

/* DICOM viewer */
.rg-viewer { padding: var(--radgo-space-lg); border-radius: var(--radgo-radius-xl); box-shadow: var(--radgo-shadow-xl); }
.rg-viewer__toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--radgo-space-sm); padding-block-end: var(--radgo-space-md); }
.rg-viewer__title {
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-sm);
    font-family: var(--radgo-font-display);
    font-size: var(--radgo-text-headline-sm);
    line-height: var(--radgo-leading-headline-sm);
    font-weight: var(--radgo-weight-bold);
}
.rg-viewer__presets { display: flex; align-items: center; gap: var(--radgo-space-xs); padding: var(--radgo-space-xs); border-radius: var(--radgo-radius-md); background: var(--radgo-glass-on-dark); }
.rg-viewer__preset {
    padding: var(--radgo-space-xs) var(--radgo-space-2);
    border-radius: var(--radgo-radius-xs);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-medium);
    color: var(--radgo-surface-dim);
    transition: background-color var(--radgo-duration-fast) var(--radgo-ease), color var(--radgo-duration-fast) var(--radgo-ease);
}
.rg-viewer__preset:hover { color: var(--radgo-on-primary); }
.rg-viewer__preset.is-active { background: var(--radgo-accent); color: var(--radgo-on-accent); font-weight: var(--radgo-weight-bold); }
.rg-viewer__canvas {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 288px;
    overflow: hidden;
    border-radius: var(--radgo-radius-md);
    background: var(--radgo-viewer);
    transition: background-color var(--radgo-duration) var(--radgo-ease);
}
.rg-viewer__canvas[data-tone="bone"] { background: var(--radgo-viewer-bone); }
.rg-viewer__canvas[data-tone="lung"] { background: var(--radgo-viewer-lung); }
.rg-viewer__canvas[data-tone="soft"] { background: var(--radgo-viewer-soft); }
.rg-viewer__render { width: 224px; height: 224px; transition: filter var(--radgo-duration) var(--radgo-ease); }
.rg-viewer__canvas[data-tone="bone"] .rg-viewer__render { filter: contrast(1.4) brightness(1.25); }
.rg-viewer__canvas[data-tone="lung"] .rg-viewer__render { filter: brightness(0.8) saturate(1.4); }
.rg-viewer__canvas[data-tone="soft"] .rg-viewer__render { filter: saturate(0.5) brightness(1.1); }
.rg-viewer__readout {
    position: absolute;
    inset-block-start: var(--radgo-space-3);
    left: var(--radgo-space-3);
    display: flex;
    flex-direction: column;
    gap: var(--radgo-space-2xs);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    color: var(--radgo-surface-dim);
    text-align: left;
}
.rg-viewer__readout-strong { color: var(--radgo-accent-bright); font-weight: var(--radgo-weight-bold); }
.rg-viewer__session {
    position: absolute;
    inset-block-end: var(--radgo-space-3);
    inset-inline-end: var(--radgo-space-3);
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-xs);
    padding: var(--radgo-space-2xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-xs);
    background: var(--radgo-glass-on-dark-strong);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-label-sm);
    color: var(--radgo-on-primary);
}
:lang(ar) .rg-viewer__session { font-family: var(--radgo-font-body); }
.rg-viewer__scrubber { display: flex; align-items: center; gap: var(--radgo-space-md); margin-block-start: var(--radgo-space-md); }
.rg-viewer__scrubber .rg-icon { color: var(--radgo-accent-dim); }
.rg-range { width: 100%; accent-color: var(--radgo-accent); cursor: pointer; }
.rg-viewer__slice { font-family: var(--radgo-font-mono); font-size: var(--radgo-text-code); color: var(--radgo-surface-dim); white-space: nowrap; }
:lang(ar) .rg-viewer__slice { font-family: var(--radgo-font-body); }
.rg-viewer__slice bdi { font-family: var(--radgo-font-mono); }
.rg-viewer__slice strong { color: var(--radgo-accent-bright); }

/* Scan drawings */
.rg-scan--axial { width: 160px; height: 160px; opacity: 0.8; }
.rg-scan--viewer { width: 100%; height: 100%; }
.rg-scan--mini { width: 80px; height: 80px; opacity: 0.7; }
.rg-scan__outline { stroke: var(--radgo-scan-mid); stroke-opacity: 0.4; stroke-width: 2; }
.rg-scan__body { fill: var(--radgo-logo-navy); stroke: var(--radgo-scan-light); stroke-opacity: 0.6; stroke-width: 1.5; }
.rg-scan__midline { stroke: var(--radgo-scan-sky); stroke-width: 1.2; stroke-dasharray: 3 3; }
.rg-scan__marker { fill: var(--radgo-danger-soft); }
.rg-scan__ruler { stroke: var(--radgo-scan-blue); stroke-width: 2; }
.rg-scan__label { fill: var(--radgo-on-primary); font-family: var(--radgo-font-mono); font-size: 10px; }
.rg-scan__ring { stroke: var(--radgo-scan-blue); stroke-width: 3; opacity: 0.6; }
.rg-scan__lens { stroke: var(--radgo-scan-sky); stroke-width: 2; opacity: 0.7; }
.rg-scan__core { fill: var(--radgo-scan-sky); opacity: 0.3; }
.rg-scan__axis { stroke: var(--radgo-scan-light); stroke-width: 1.5; stroke-dasharray: 4 4; }
.rg-scan__mini { stroke: var(--radgo-accent-dim); stroke-width: 2; }
.rg-scan__mini--thin { stroke-width: 1.5; }

/* Report draft */
.rg-report__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--radgo-space-sm); padding: var(--radgo-space-md); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-high); color: var(--radgo-text); }
.rg-report__state { display: inline-flex; align-items: center; gap: var(--radgo-space-3); }
.rg-report__state .rg-ping { width: 12px; height: 12px; }
:lang(ar) .rg-report__state .rg-mono { font-family: var(--radgo-font-body); }
.rg-report__versions { display: inline-flex; align-items: flex-end; gap: var(--radgo-space-xs); }
.rg-report__version { width: 6px; height: 12px; border-radius: var(--radgo-radius-xs); background: var(--radgo-accent-dim); }
.rg-report__version.is-current { height: 22px; background: var(--radgo-accent); animation: rg-pulse 2s var(--radgo-ease) infinite; }
.rg-report__doc {
    display: flex;
    flex-direction: column;
    gap: var(--radgo-space-sm);
    padding: var(--radgo-space-md);
    border-radius: var(--radgo-radius-md);
    background: var(--radgo-surface-alt);
    font-size: var(--radgo-text-body-sm);
    line-height: var(--radgo-leading-body-sm);
    color: var(--radgo-text);
}
.rg-report__section { font-size: var(--radgo-text-label-sm); line-height: var(--radgo-leading-label-sm); font-weight: var(--radgo-weight-bold); text-transform: uppercase; color: var(--radgo-text-muted); }
.rg-report__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--radgo-space-sm); flex-wrap: wrap; padding-block-start: var(--radgo-space-xs); }
:lang(ar) .rg-report__foot .rg-mono { font-family: var(--radgo-font-body); }

/* Delivery channels */
.rg-channels__tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--radgo-space-sm); }
.rg-channels__tab {
    padding: var(--radgo-space-3);
    border-radius: var(--radgo-radius-lg);
    background: var(--radgo-surface-container);
    color: var(--radgo-text);
    font-size: var(--radgo-text-label-md);
    line-height: var(--radgo-leading-label-md);
    font-weight: var(--radgo-weight-semibold);
    text-align: center;
    transition: background-color var(--radgo-duration-fast) var(--radgo-ease);
}
.rg-channels__tab:hover { background: var(--radgo-surface-high); }
.rg-channels__tab.is-selected { background: var(--radgo-accent-soft); color: var(--radgo-accent-ink); font-weight: var(--radgo-weight-bold); }
.rg-channels__preview { display: flex; flex-direction: column; gap: var(--radgo-space-3); padding: var(--radgo-space-md); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-alt); }
.rg-channels__preview[hidden] { display: none; }
.rg-channels__preview-head { display: flex; align-items: center; justify-content: space-between; gap: var(--radgo-space-sm); padding-block-end: var(--radgo-space-sm); }
.rg-channels__preview-title { display: inline-flex; align-items: center; gap: var(--radgo-space-sm); font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-channels__state { display: inline-flex; align-items: center; gap: var(--radgo-space-xs); font-family: var(--radgo-font-mono); font-size: var(--radgo-text-code); font-weight: var(--radgo-weight-bold); color: var(--radgo-accent); white-space: nowrap; }
:lang(ar) .rg-channels__state { font-family: var(--radgo-font-body); }
.rg-channels__to { font-family: var(--radgo-font-mono); font-size: var(--radgo-text-caption); color: var(--radgo-text-muted); unicode-bidi: plaintext; }
:lang(ar) .rg-channels__to { font-family: var(--radgo-font-body); }
.rg-channels__message { padding: var(--radgo-space-3); border-radius: var(--radgo-radius-md); background: var(--radgo-surface-raised); font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text); }

/* ---- Mobile section ------------------------------------------------------ */
.rg-mobile__grid { display: grid; grid-template-columns: 1fr; gap: var(--radgo-space-xl); align-items: center; }
.rg-feature-rows { display: flex; flex-direction: column; gap: var(--radgo-space-sm); }
.rg-feature-row { display: flex; align-items: flex-start; gap: var(--radgo-space-3); padding: var(--radgo-space-3); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-raised); box-shadow: var(--radgo-shadow-sm); }
.rg-feature-row .rg-icon { margin-block-start: var(--radgo-space-2xs); }
.rg-feature-row__title { display: block; font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-feature-row__text { font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }
.rg-mobile__phones { display: flex; justify-content: center; align-items: center; gap: var(--radgo-space-md); }

.rg-device--phone {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: var(--radgo-width-phone);
    height: var(--radgo-height-phone);
    padding: var(--radgo-space-3);
    border-radius: var(--radgo-radius-2xl);
    background: var(--radgo-surface-raised);
    color: var(--radgo-text);
    box-shadow: var(--radgo-shadow-2xl);
    flex-shrink: 0;
}
.rg-device--phone.rg-device--dark { background: var(--radgo-primary); color: var(--radgo-on-primary); }
.rg-device--phone .rg-device__screen { display: flex; flex-direction: column; justify-content: space-between; height: 100%; gap: var(--radgo-space-3); }
.rg-phone--offset { margin-block-start: -32px; }
.rg-phone__stack { display: flex; flex-direction: column; gap: var(--radgo-space-3); }
.rg-phone__status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--radgo-space-xs) var(--radgo-space-xs) 0;
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-label-sm);
    color: var(--radgo-text-muted);
}
.rg-device--dark .rg-phone__status { color: var(--radgo-surface-dim); }
.rg-phone__signal { display: inline-flex; align-items: center; gap: var(--radgo-space-xs); }
.rg-phone__alert {
    display: flex;
    align-items: center;
    gap: var(--radgo-space-sm);
    padding: var(--radgo-space-2);
    border-radius: var(--radgo-radius-lg);
    background: var(--radgo-danger);
    color: var(--radgo-on-danger);
    box-shadow: var(--radgo-shadow-sm);
}
.rg-phone__micro { display: block; font-family: var(--radgo-font-mono); font-size: var(--radgo-text-micro); line-height: var(--radgo-leading-micro); text-transform: uppercase; }
:lang(ar) .rg-phone__micro { font-family: var(--radgo-font-body); font-size: var(--radgo-text-label-sm); line-height: var(--radgo-leading-label-sm); }
.rg-phone__small { display: block; font-size: var(--radgo-text-label-sm); line-height: var(--radgo-leading-label-sm); }
.rg-phone__heading { display: block; font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); }
.rg-phone__meta { display: block; font-size: var(--radgo-text-caption); color: var(--radgo-surface-dim); }
.rg-phone__card { display: flex; flex-direction: column; gap: var(--radgo-space-xs); padding: var(--radgo-space-2); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-alt); }
.rg-phone__card--glass { padding: var(--radgo-space-3); background: var(--radgo-glass-on-dark); }
.rg-progress { display: block; height: 4px; margin-block-start: var(--radgo-space-xs); border-radius: var(--radgo-radius-full); background: var(--radgo-glass-on-dark-strong); overflow: hidden; }
.rg-progress__bar { display: block; width: 38%; height: 100%; border-radius: inherit; background: var(--radgo-accent-dim); }
.rg-phone__slice { position: relative; display: flex; align-items: center; justify-content: center; height: 112px; border-radius: var(--radgo-radius-md); background: var(--radgo-viewer); overflow: hidden; }
.rg-phone__slice-label { position: absolute; inset-block-end: var(--radgo-space-xs); right: var(--radgo-space-sm); font-family: var(--radgo-font-mono); font-size: 9px; color: var(--radgo-accent-bright); }
.rg-phone__chip { padding: var(--radgo-space-2); border-radius: var(--radgo-radius-lg); background: var(--radgo-accent-soft); color: var(--radgo-accent-ink); }
.rg-phone__queue { padding: var(--radgo-space-2); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-container); text-align: center; }
.rg-phone__action {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--radgo-space-xs);
    width: 100%;
    padding-block: var(--radgo-space-sm);
    border-radius: var(--radgo-radius-md);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    font-weight: var(--radgo-weight-bold);
    box-shadow: var(--radgo-shadow-md);
}
.rg-phone__action--accent { background: var(--radgo-accent); color: var(--radgo-on-accent); }
.rg-phone__action--ink { background: var(--radgo-primary); color: var(--radgo-on-primary); }

/* ---- Cards --------------------------------------------------------------- */
.rg-card { display: flex; flex-direction: column; justify-content: space-between; text-align: start; }
.rg-card__body { display: flex; flex-direction: column; gap: var(--radgo-space-sm); }
.rg-card__icon { display: inline-flex; color: var(--radgo-accent); }
.rg-card__icon--tile {
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radgo-radius-md);
    background: var(--radgo-accent);
    color: var(--radgo-on-accent);
}
.rg-card__eyebrow { font-family: var(--radgo-font-mono); font-size: var(--radgo-text-code); line-height: var(--radgo-leading-code); font-weight: var(--radgo-weight-bold); color: var(--radgo-accent); }
:lang(ar) .rg-card__eyebrow { font-family: var(--radgo-font-body); }
.rg-card__title {
    font-family: var(--radgo-font-display);
    font-size: var(--radgo-text-headline-sm);
    line-height: var(--radgo-leading-headline-sm);
    letter-spacing: var(--radgo-tracking-headline-sm);
    font-weight: var(--radgo-weight-bold);
    color: var(--radgo-text);
}
.rg-card__text { font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }
.rg-card__foot {
    padding-block-start: var(--radgo-space-sm);
    font-family: var(--radgo-font-mono);
    font-size: var(--radgo-text-code);
    line-height: var(--radgo-leading-code);
    font-weight: var(--radgo-weight-bold);
    color: var(--radgo-accent);
}
:lang(ar) .rg-card__foot { font-family: var(--radgo-font-body); font-size: var(--radgo-text-label-lg); line-height: var(--radgo-leading-label-lg); }
.rg-card--raised { padding: var(--radgo-space-lg); border-radius: var(--radgo-radius-xl); background: var(--radgo-surface-raised); box-shadow: var(--radgo-shadow-md); }
.rg-card--split .rg-card__foot { padding-block-start: var(--radgo-space-md); font-weight: var(--radgo-weight-semibold); }
.rg-card--tinted { padding: var(--radgo-space-md); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-alt); }
.rg-card--tinted .rg-card__body { gap: var(--radgo-space-xs); }
.rg-card--tinted .rg-card__title { font-family: var(--radgo-font-body); font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); letter-spacing: 0; }
.rg-card--numbered { padding: var(--radgo-space-md); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-alt); }
.rg-card--glass {
    padding: var(--radgo-space-lg);
    border-radius: var(--radgo-radius-xl);
    background: var(--radgo-glass-on-dark);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}
.rg-card--glass .rg-card__title { color: var(--radgo-on-primary); }
.rg-card--glass .rg-card__text { color: var(--radgo-surface-dim); }

.rg-security-card { display: flex; flex-direction: column; gap: var(--radgo-space-xs); padding: var(--radgo-space-lg); border-radius: var(--radgo-radius-xl); background: var(--radgo-surface-raised); box-shadow: var(--radgo-shadow-sm); text-align: start; }
.rg-security-card__title { display: flex; align-items: center; gap: var(--radgo-space-sm); margin-block-end: var(--radgo-space-sm); font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-security-card__title .rg-icon { color: var(--radgo-accent); }
.rg-security-card__text { font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }

/* ---- Delivery comparison ------------------------------------------------- */
.rg-compare { display: grid; grid-template-columns: 1fr; gap: var(--radgo-space-lg); }
.rg-compare__card { display: flex; flex-direction: column; gap: var(--radgo-space-md); padding: var(--radgo-space-xl); border-radius: var(--radgo-radius-xl); background: var(--radgo-surface-raised); box-shadow: var(--radgo-shadow-sm); text-align: start; }
.rg-compare__card--navy { background: var(--radgo-primary); color: var(--radgo-on-primary); box-shadow: var(--radgo-shadow-xl); }
.rg-compare__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--radgo-space-sm); padding-block-end: var(--radgo-space-sm); }
.rg-compare__title { font-family: var(--radgo-font-display); font-size: var(--radgo-text-headline-sm); line-height: var(--radgo-leading-headline-sm); font-weight: var(--radgo-weight-bold); color: var(--radgo-text-muted); }
.rg-compare__card--navy .rg-compare__title { color: var(--radgo-accent-bright); }
.rg-compare__chip { padding: var(--radgo-space-xs) var(--radgo-space-sm); border-radius: var(--radgo-radius-xs); background: var(--radgo-accent-soft); color: var(--radgo-accent-ink); font-family: var(--radgo-font-mono); font-size: var(--radgo-text-code); line-height: var(--radgo-leading-code); font-weight: var(--radgo-weight-bold); }
:lang(ar) .rg-compare__chip { font-family: var(--radgo-font-body); }
.rg-compare__chip--danger { background: var(--radgo-danger-soft); color: var(--radgo-danger-ink); }
.rg-compare__steps { display: flex; flex-direction: column; gap: var(--radgo-space-md); font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }
.rg-compare__card--navy .rg-compare__steps { color: var(--radgo-surface-dim); }
.rg-compare__step { display: flex; align-items: flex-start; gap: var(--radgo-space-3); }
.rg-compare__num { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: var(--radgo-radius-full); background: var(--radgo-danger-soft); color: var(--radgo-danger-ink); font-weight: var(--radgo-weight-bold); flex-shrink: 0; }
.rg-compare__card--navy .rg-compare__num { background: var(--radgo-accent); color: var(--radgo-on-accent); }
.rg-compare__step-title { display: block; font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-compare__card--navy .rg-compare__step-title { color: var(--radgo-on-primary); }

/* ---- Report lifecycle band ----------------------------------------------- */
.rg-band__card {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--radgo-space-lg);
    align-items: center;
    padding: var(--radgo-space-xl);
    border-radius: var(--radgo-radius-xl);
    background: var(--radgo-surface-raised);
    box-shadow: var(--radgo-shadow-md);
}
.rg-band__copy { gap: var(--radgo-space-sm); }
.rg-band__aside { display: flex; justify-content: flex-end; }
.rg-band__list { display: flex; flex-direction: column; gap: var(--radgo-space-sm); width: 100%; max-width: var(--radgo-width-note); padding: var(--radgo-space-md); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-alt); }
.rg-band__list-title { font-size: var(--radgo-text-label-sm); line-height: var(--radgo-leading-label-sm); font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-band__row { display: flex; align-items: center; justify-content: space-between; gap: var(--radgo-space-sm); font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); }
.rg-band__label { display: inline-flex; align-items: center; gap: var(--radgo-space-xs); font-weight: var(--radgo-weight-semibold); color: var(--radgo-text-muted); }
.rg-band__label.rg-accent-text { color: var(--radgo-accent); }
:lang(ar) .rg-band__row .rg-mono { font-family: var(--radgo-font-body); }

/* ---- Clinical impact (scenario cards) ------------------------------------ */
.rg-quote { display: flex; flex-direction: column; justify-content: space-between; margin: 0; padding: var(--radgo-space-lg); border-radius: var(--radgo-radius-xl); background: var(--radgo-surface-raised); box-shadow: var(--radgo-shadow-md); text-align: start; }
.rg-quote__body { display: flex; flex-direction: column; gap: var(--radgo-space-md); }
.rg-quote__text { font-size: var(--radgo-text-body-md); line-height: var(--radgo-leading-body-md); font-style: italic; color: var(--radgo-text); }
:lang(ar) .rg-quote__text { font-style: normal; }
.rg-quote__by { padding-block-start: var(--radgo-space-md); }
.rg-quote__who { display: block; font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); color: var(--radgo-text); }
.rg-quote__role { font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }

/* ---- Final CTA ----------------------------------------------------------- */
.rg-cta__wash { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top right, var(--radgo-accent-wash), transparent, transparent); }
[dir="rtl"] .rg-cta__wash { background: linear-gradient(to top left, var(--radgo-accent-wash), transparent, transparent); }
.rg-cta__inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: var(--radgo-space-md); text-align: center; }
.rg-cta__inner .rg-pill { margin-block-end: var(--radgo-space-xs); }
.rg-cta__title {
    font-family: var(--radgo-font-display);
    font-size: var(--radgo-text-display);
    line-height: var(--radgo-leading-display);
    letter-spacing: var(--radgo-tracking-display);
    font-weight: var(--radgo-weight-bold);
    color: var(--radgo-on-primary);
    text-wrap: balance;
}
.rg-cta__lede { max-width: var(--radgo-width-lede); margin-block-end: var(--radgo-space-lg); font-size: var(--radgo-text-body-lg); line-height: var(--radgo-leading-body-lg); color: var(--radgo-surface-dim); }
.rg-cta__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--radgo-space-md); padding-block-start: var(--radgo-space-xs); }
.rg-cta__foot { padding-block-start: var(--radgo-space-md); font-size: var(--radgo-text-label-sm); line-height: var(--radgo-leading-label-sm); font-weight: var(--radgo-weight-semibold); color: var(--radgo-surface-dim); }

/* ---- Not found / error --------------------------------------------------- */
.rg-message { min-height: 50vh; display: flex; align-items: center; }
.rg-message__inner { display: flex; flex-direction: column; align-items: center; gap: var(--radgo-space-md); text-align: center; }
.rg-message__title { font-family: var(--radgo-font-display); font-size: var(--radgo-text-display); line-height: var(--radgo-leading-display); font-weight: var(--radgo-weight-bold); }

/* ---- Footer -------------------------------------------------------------- */
.rg-footer { margin-block-start: var(--radgo-space-xl); background: var(--radgo-surface-alt); color: var(--radgo-text); box-shadow: var(--radgo-shadow-footer); }
.rg-footer__inner { padding: var(--radgo-space-xl) var(--radgo-margin-desktop) calc(var(--radgo-space-xl) + var(--radgo-space-2xl)); }
.rg-footer__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--radgo-space-lg); margin-block-end: var(--radgo-space-xl); }
.rg-footer__brand { grid-column: span 2; display: flex; flex-direction: column; align-items: flex-start; gap: var(--radgo-space-md); }
.rg-footer__about { font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); }
.rg-lang-footer {
    display: inline-flex;
    align-items: center;
    gap: var(--radgo-space-xs);
    padding: var(--radgo-space-xs) var(--radgo-space-sm);
    border-radius: var(--radgo-radius-md);
    background: var(--radgo-surface-high);
    color: var(--radgo-text);
    font-size: var(--radgo-text-label-sm);
    line-height: var(--radgo-leading-label-sm);
    font-weight: var(--radgo-weight-semibold);
}
.rg-lang-footer:hover { background: var(--radgo-surface-highest); }
.rg-footer__heading { margin-block-end: var(--radgo-space-md); font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); letter-spacing: var(--radgo-tracking-wider); font-weight: var(--radgo-weight-bold); text-transform: uppercase; color: var(--radgo-text); }
.rg-footer__list { display: flex; flex-direction: column; gap: var(--radgo-space-sm); }
.rg-footer__list li { display: flex; align-items: center; min-height: 32px; }
.rg-footer__link { font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); transition: color var(--radgo-duration-fast) var(--radgo-ease); }
.rg-footer__link:hover { color: var(--radgo-text); }
.rg-footer__safeguards { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--radgo-space-md); margin-block-end: var(--radgo-space-lg); padding: var(--radgo-space-lg); border-radius: var(--radgo-radius-lg); background: var(--radgo-surface-container); }
.rg-footer__safeguards-title { display: flex; align-items: center; gap: var(--radgo-space-sm); font-size: var(--radgo-text-label-md); line-height: var(--radgo-leading-label-md); font-weight: var(--radgo-weight-bold); }
.rg-footer__safeguards-title .rg-icon { color: var(--radgo-accent); }
.rg-footer__badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--radgo-space-sm); }
.rg-footer__badge { display: inline-flex; align-items: center; gap: var(--radgo-space-xs); padding: var(--radgo-space-xs) var(--radgo-space-sm); border-radius: var(--radgo-radius-full); background: var(--radgo-surface-raised); box-shadow: var(--radgo-shadow-sm); font-family: var(--radgo-font-mono); font-size: var(--radgo-text-code); line-height: var(--radgo-leading-code); }
:lang(ar) .rg-footer__badge { font-family: var(--radgo-font-body); }
.rg-footer__legal { display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: var(--radgo-space-md); padding-block-start: var(--radgo-space-md); font-size: var(--radgo-text-body-sm); line-height: var(--radgo-leading-body-sm); color: var(--radgo-text-muted); text-align: center; }
.rg-footer__trademark { font-family: var(--radgo-font-mono); font-size: var(--radgo-text-code); line-height: var(--radgo-leading-code); }
:lang(ar) .rg-footer__trademark { font-family: var(--radgo-font-body); }

/* ==========================================================================
   Responsive — Stitch breakpoints: sm 640 · md 768 · lg 1024 · xl 1280
   Below 768 the page uses the Stitch mobile/tablet margins.
   ========================================================================== */
@media (max-width: 767.98px) {
    :root { --radgo-margin-desktop: var(--radgo-margin-tablet); --radgo-space-section: 72px; }
    .rg-hero__title,
    .rg-cta__title {
        font-size: var(--radgo-text-display-sm);
        line-height: var(--radgo-leading-display-sm);
        letter-spacing: var(--radgo-tracking-display-sm);
    }
}

@media (max-width: 639.98px) {
    :root { --radgo-margin-desktop: var(--radgo-margin-mobile); --radgo-header-height: 64px; --radgo-space-section: 64px; }
    .rg-logo__mark { width: 28px; height: 28px; }
    .rg-header__demo { display: none; }
    .rg-hero__actions { flex-direction: column; align-items: stretch; width: 100%; }
    .rg-hero__actions .rg-button { white-space: normal; }
    .rg-hero__trust { align-items: flex-start; text-align: start; }
    .rg-device__titlebar { flex-wrap: wrap; padding-inline: var(--radgo-space-md); }
    .rg-worklist__filters { padding-inline: var(--radgo-space-md); }
    .rg-step-panel { padding: var(--radgo-space-lg); }
    .rg-panel,
    .rg-viewer { padding: var(--radgo-space-md); }
    .rg-queue__row { flex-direction: column; align-items: stretch; }
    .rg-queue__time { flex-direction: row; justify-content: space-between; align-items: center; }
    .rg-viewer__canvas { height: 240px; }
    .rg-viewer__render { width: 180px; height: 180px; }
    .rg-mini-stats { grid-template-columns: 1fr; }
    /* Two 256px handsets do not fit a phone screen: scale the whole composition, never crop it. */
    .rg-mobile__phones { zoom: 0.66; }
    .rg-metric { padding: var(--radgo-space-md); }
    .rg-metric__value { font-size: var(--radgo-text-headline-md); line-height: var(--radgo-leading-headline-md); }
    .rg-trust-item { font-size: var(--radgo-text-body-lg); line-height: var(--radgo-leading-body-lg); }
    /* The hero worklist keeps its key columns on phones so the mock-up fits without cropping. */
    .rg-worklist__table th:nth-child(n+3):not(:nth-child(5)),
    .rg-worklist__table td:nth-child(n+3):not(:nth-child(5)) { display: none; }
    .rg-compare__card,
    .rg-band__card { padding: var(--radgo-space-lg); }
    .rg-lang-pill { inset-block-end: var(--radgo-space-md); inset-inline-end: var(--radgo-space-md); }
    .rg-cta__actions { flex-direction: column; align-items: stretch; width: 100%; }
}

/* Tablet: the hero worklist drops consultant, status and due so it fits without cropping. */
@media (min-width: 640px) and (max-width: 1023.98px) {
    .rg-worklist__table th:nth-child(n+6),
    .rg-worklist__table td:nth-child(n+6) { display: none; }
}

@media (min-width: 640px) {
    .rg-header__signin { display: inline-flex; }
    .rg-step-panel__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .rg-footer__legal { flex-direction: row; text-align: start; }
}

@media (min-width: 768px) {
    .rg-trust__list { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .rg-steps { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .rg-toast { display: flex; }
    .rg-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .rg-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #security .rg-grid--3,
    #why .rg-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rg-footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
    .rg-nav { display: flex; }
    .rg-menu-button { display: none; }
    .rg-header__lang { display: inline-flex; }
    .rg-header__avatar { display: inline-flex; }
    .rg-float-viewer { display: flex; }
    .rg-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .rg-metric__value { font-size: var(--radgo-text-display); line-height: var(--radgo-leading-display); }
    :lang(ar) .rg-metric__value { font-size: var(--radgo-text-headline-lg); line-height: var(--radgo-leading-headline-lg); }
    .rg-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    #security .rg-grid--3,
    #why .rg-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .rg-step-panel { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .rg-step-panel__copy { grid-column: span 7; }
    .rg-step-panel__aside { grid-column: span 5; }
    .rg-showcase,
    .rg-mobile__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .rg-showcase__copy,
    .rg-mobile__copy { grid-column: span 5; }
    .rg-showcase__visual,
    .rg-mobile__phones { grid-column: span 7; }
    .rg-showcase--reverse .rg-showcase__visual { order: -1; }
    .rg-compare { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rg-band__card { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .rg-band__copy { grid-column: span 8; }
    .rg-band__aside { grid-column: span 4; }
    .rg-footer__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .rg-footer__brand { grid-column: span 1; }
}

/* The badge needs room the eight-item navigation only has from 1440px. */
@media (min-width: 1440px) {
    .rg-header__badge { display: inline-flex; }
}

/* Between lg and xl the eight-item navigation is tight: keep it on one line. */
@media (min-width: 1024px) and (max-width: 1279.98px) {
    .rg-header__bar { gap: var(--radgo-space-md); }
    .rg-header__actions { gap: var(--radgo-space-sm); }
    .rg-nav__link { padding-inline: 6px; }
}

/* ---- Motion preferences -------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    .rg-ping__wave { display: none; }
}