/* =================================================================
   SweepsEdge brand layer

   Mirrors www.sweepsedge.com (SweepsEdgeProduction
   src/components/site-chrome.module.css, src/app/page.module.css and
   src/components/product-page.module.css) so arriving on Track from the
   marketing site feels like the same product: same header, footer, type,
   buttons and surfaces. Colors come from the theme tokens in theme.css,
   so every rule here works in both the dark (default) and light themes.

   Bootstrap is 5.1, which paints most component colors directly rather
   than through CSS variables, so components are re-skinned property by
   property below.
   ================================================================= */

:root {
    --edge-font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    --edge-font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    --bs-font-sans-serif: var(--edge-font-sans);
    --bs-font-monospace: var(--edge-font-mono);
    --bs-body-font-family: var(--edge-font-sans);
    --edge-radius-sm: 6px;
    --edge-radius: 8px;
    --edge-radius-lg: 14px;
}

/* =================================================================
   Base
   ================================================================= */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    font-family: var(--edge-font-sans);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: 640;
    letter-spacing: -0.02em;
}

h1, .h1 { letter-spacing: -0.035em; }
h2, .h2 { letter-spacing: -0.03em; }

.display-1, .display-2, .display-3,
.display-4, .display-5, .display-6 {
    font-weight: 650;
    letter-spacing: -0.045em;
    line-height: 1.05;
}

.lead { font-weight: 400; }

code, kbd, pre, samp { font-family: var(--edge-font-mono); }

code {
    padding: 0.1em 0.35em;
    border-radius: 5px;
    font-size: 0.85em;
}

pre code { padding: 0; background: transparent; }

a {
    text-decoration-color: rgba(var(--bs-primary-rgb), 0.4);
    text-underline-offset: 3px;
}

a:hover { text-decoration-color: currentColor; }

/* Bootstrap paints <hr> in currentColor; keep it at hairline strength. */
hr { opacity: 0.14; }

::selection { background: rgba(var(--edge-violet-rgb), 0.35); }

/* sweepsedge.com lays everything out on a 1180px column. */
@media (min-width: 1200px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl,
    .container-xxl {
        max-width: 1204px;
    }
}

.edge-main {
    flex: 1 0 auto;
    padding: 32px 0 64px;
}

.edge-main--flush { padding: 0; }

/* =================================================================
   Header
   ================================================================= */
.edge-header {
    position: sticky;
    top: 0;
    z-index: 1030;
    border-bottom: 1px solid var(--edge-line);
    background: var(--edge-header-bg);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
}

.edge-navbar {
    padding: 0;
}

.edge-navbar > .container {
    flex-wrap: nowrap;
    gap: 20px;
    min-height: 72px;
}

.edge-brand {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    color: var(--edge-text);
    text-decoration: none;
}

.edge-brand:hover { color: var(--edge-text); }

.edge-brand-lockup {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    line-height: 1;
}

.edge-brand .header-logo {
    width: 165px;
    height: auto;
}

.edge-brand-divider {
    width: 1px;
    height: 22px;
    background-color: var(--edge-line-strong);
}

.edge-brand-name {
    color: var(--edge-text-2);
    font-size: 0.7rem;
    font-weight: 720;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

/* The dark logo's artwork sits ~5px below the centre of its SVG box (the light
   one is centred). Nudge the divider and label rather than the logo, so the
   logo lands exactly where it does on www.sweepsedge.com. */
[data-theme="dark"] .edge-brand-divider,
[data-theme="dark"] .edge-brand-name { transform: translateY(4px); }

.edge-nav {
    align-items: center;
    gap: 26px;
    margin: 0 auto;
}

.edge-navbar .edge-nav .nav-link {
    padding: 8px 0;
    color: var(--edge-nav-link);
    font-size: 0.84rem;
    font-weight: 500;
    transition: color 150ms ease;
}

.edge-navbar .edge-nav .nav-link:hover,
.edge-navbar .edge-nav .nav-link:focus-visible,
.edge-navbar .edge-nav .nav-link.show {
    color: var(--edge-text);
}

.edge-nav .dropdown-toggle::after {
    margin-left: 0.35em;
    vertical-align: 0.16em;
    border-top-width: 0.26em;
    border-right-width: 0.26em;
    border-left-width: 0.26em;
    opacity: 0.7;
}

.edge-nav .dropdown-menu { margin-top: 14px; }

.edge-header-actions {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-shrink: 0;
}

/* Header buttons: .refillButton / .buyButtonSmall on sweepsedge.com */
.edge-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 39px;
    padding: 0 14px;
    border: 1px solid transparent;
    border-radius: var(--edge-radius);
    font-size: 0.78rem;
    font-weight: 680;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: transform 150ms ease, border-color 150ms ease, background-color 150ms ease, color 150ms ease;
}

.edge-btn:hover { transform: translateY(-1px); }

.edge-btn-primary {
    color: var(--edge-on-accent);
    background-color: var(--edge-accent-strong);
    border-color: var(--edge-accent-strong);
}

.edge-btn-primary:hover,
.edge-btn-primary:focus-visible {
    color: var(--edge-on-accent);
    background-color: var(--edge-accent-hover);
    border-color: var(--edge-accent-hover);
}

.edge-btn-ghost {
    color: var(--edge-text-2);
    border-color: var(--edge-line);
}

.edge-btn-ghost:hover,
.edge-btn-ghost:focus-visible {
    color: var(--edge-text);
    border-color: var(--edge-line-strong);
}

/* Menu toggle: the "Menu" pill from the sweepsedge.com mobile header */
.edge-menu-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 0 11px;
    color: var(--edge-text-2);
    border: 1px solid var(--edge-line);
    border-radius: var(--edge-radius);
    background: var(--edge-surface);
    font-size: 0.72rem;
    font-weight: 680;
    box-shadow: none;
}

.edge-menu-toggle:hover { color: var(--edge-text); }
.edge-menu-toggle:focus { box-shadow: 0 0 0 0.2rem var(--theme-focus-ring-color); }
.edge-menu-toggle svg { width: 16px; height: 16px; }

/* Account menu */
.edge-account {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 220px;
    min-height: 39px;
    padding: 0 10px 0 5px;
    color: var(--edge-text-2);
    border: 1px solid var(--edge-line);
    border-radius: 999px;
    background: transparent;
    font-size: 0.8rem;
    font-weight: 600;
    transition: border-color 150ms ease, color 150ms ease;
}

.edge-account:hover,
.edge-account:focus-visible,
.edge-account.show {
    color: var(--edge-text);
    border-color: var(--edge-line-strong);
}

.edge-account::after { opacity: 0.7; }

.edge-avatar {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    color: var(--edge-on-accent);
    border-radius: 50%;
    background: var(--edge-accent-strong);
    font-size: 0.74rem;
    font-weight: 750;
    line-height: 1;
    text-transform: uppercase;
}

.edge-account-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.edge-account-menu { min-width: 15rem; margin-top: 10px !important; }

.edge-account-menu .dropdown-header {
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    color: var(--edge-text);
    font-size: 0.86rem;
    font-weight: 650;
    letter-spacing: 0;
    text-transform: none;
}

.edge-account-menu .dropdown-header small {
    display: block;
    margin-top: 2px;
    color: var(--edge-faint);
    font-size: 0.72rem;
    font-weight: 500;
}

/* Theme toggle */
#theme-toggle {
    gap: 8px;
    min-width: 39px;
    min-height: 39px;
    color: var(--edge-nav-link);
    border-radius: var(--edge-radius);
}

#theme-toggle:hover {
    color: var(--edge-text);
    background-color: rgba(var(--edge-text-rgb), 0.06);
}

#theme-toggle svg { width: 18px; height: 18px; }

.edge-theme-label {
    font-size: 0.84rem;
    font-weight: 500;
}

@media (min-width: 992px) {
    .edge-navbar .navbar-collapse {
        align-items: center;
        gap: 12px;
    }

    .edge-nav-extras {
        align-items: center;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .edge-nav { gap: 18px; }
    .edge-brand .header-logo { width: 142px; }
    .edge-account-name { max-width: 110px; }
}

/* Collapsed navigation becomes the floating menu panel sweepsedge.com uses. */
@media (max-width: 991.98px) {
    .edge-navbar > .container { gap: 10px; }

    .edge-header-actions { margin-left: auto; }

    /* Opens instantly, like the sweepsedge.com menu; a height animation on a
       padded floating panel flashes an empty box first. */
    .edge-navbar .navbar-collapse.collapsing { transition: none; }

    .edge-navbar .navbar-collapse {
        position: absolute;
        top: calc(100% + 8px);
        right: 12px;
        width: min(320px, calc(100vw - 24px));
        max-height: calc(100vh - 96px);
        overflow-y: auto;
        padding: 9px;
        border: 1px solid var(--edge-line);
        border-radius: 12px;
        background: var(--edge-menu-bg);
        box-shadow: var(--edge-menu-shadow);
    }

    .edge-nav {
        align-items: stretch;
        gap: 0;
        margin: 0;
    }

    .edge-navbar .edge-nav .nav-link {
        padding: 11px 12px;
        color: var(--edge-text-2);
        border-radius: var(--edge-radius-sm);
        font-size: 0.86rem;
    }

    .edge-navbar .edge-nav .nav-link:hover,
    .edge-navbar .edge-nav .nav-link:focus-visible {
        background: rgba(var(--edge-text-rgb), 0.06);
    }

    .edge-nav .dropdown-menu {
        margin: 0 0 6px;
        padding: 0 0 0 10px;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .edge-nav-extras {
        margin-top: 6px;
        padding-top: 6px;
        border-top: 1px solid var(--edge-line);
    }

    .edge-nav-extras #theme-toggle {
        justify-content: flex-start;
        width: 100%;
        padding: 11px 12px;
    }
}

@media (max-width: 619.98px) {
    .edge-brand .header-logo { width: 132px; }
    .edge-brand-lockup { gap: 8px; }
    .edge-brand-name { font-size: 0.62rem; letter-spacing: 0.12em; }
    .edge-account { padding-right: 8px; }
    .edge-account-name { display: none; }
    .edge-btn { min-height: 36px; padding: 0 11px; }
}

@media (max-width: 419.98px) {
    .edge-header-actions .edge-btn-ghost { display: none; }
    .edge-menu-toggle span { display: none; }
}

/* =================================================================
   Footer (SiteFooter on sweepsedge.com)
   ================================================================= */
.edge-footer {
    flex-shrink: 0;
    border-top: 1px solid var(--edge-line);
}

.edge-footer-inner {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 36px;
    align-items: flex-start;
    padding-top: 38px;
    padding-bottom: 27px;
}

.edge-footer .edge-brand .header-logo { width: 158px; }

.edge-footer-brand p {
    margin: 13px 0 0;
    color: var(--edge-muted);
    font-size: 0.72rem;
}

.edge-footer-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px 20px;
    max-width: 640px;
    font-size: 0.72rem;
}

.edge-footer-nav a {
    color: var(--edge-faint);
    text-decoration: none;
}

.edge-footer-nav a:hover { color: var(--edge-text); }

.edge-footer-legal {
    grid-column: 1 / -1;
    padding-top: 20px;
    color: var(--edge-faint);
    border-top: 1px solid var(--edge-line);
    font-size: 0.66rem;
}

@media (max-width: 619.98px) {
    .edge-footer-inner { grid-template-columns: 1fr; gap: 24px; }
    .edge-footer-nav { justify-content: flex-start; }
}

/* =================================================================
   Buttons
   Each variant sets the same six tokens; one set of rules applies them.
   ================================================================= */
.btn {
    --edge-btn-fg: var(--edge-text);
    --edge-btn-bg: transparent;
    --edge-btn-border: transparent;
    --edge-btn-hover-fg: var(--edge-btn-fg);
    --edge-btn-hover-bg: var(--edge-btn-bg);
    --edge-btn-hover-border: var(--edge-btn-border);
    border-radius: var(--edge-radius);
    font-weight: 620;
    transition: transform 150ms ease, color 150ms ease, background-color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;
}

.btn-sm { border-radius: var(--edge-radius-sm); }
.btn-lg { border-radius: 10px; font-weight: 680; }
.btn-lg:hover { transform: translateY(-1px); }

.btn-primary {
    --edge-btn-fg: var(--edge-on-accent);
    --edge-btn-bg: var(--edge-accent-strong);
    --edge-btn-border: var(--edge-accent-strong);
    --edge-btn-hover-fg: var(--edge-on-accent);
    --edge-btn-hover-bg: var(--edge-accent-hover);
    --edge-btn-hover-border: var(--edge-accent-hover);
}

.btn-secondary,
.btn-light,
.btn-dark {
    --edge-btn-fg: var(--edge-text);
    --edge-btn-bg: var(--edge-surface-2);
    --edge-btn-border: var(--edge-line-strong);
    --edge-btn-hover-fg: var(--edge-text);
    --edge-btn-hover-bg: var(--edge-surface-3);
    --edge-btn-hover-border: var(--edge-line-strong);
}

.btn-success {
    --edge-btn-fg: var(--edge-on-success);
    --edge-btn-bg: var(--bs-success);
    --edge-btn-border: var(--bs-success);
    --edge-btn-hover-fg: var(--edge-on-success);
    --edge-btn-hover-bg: color-mix(in srgb, var(--bs-success) 86%, var(--edge-hover-mix));
    --edge-btn-hover-border: var(--edge-btn-hover-bg);
}

.btn-danger {
    --edge-btn-fg: var(--edge-on-danger);
    --edge-btn-bg: var(--bs-danger);
    --edge-btn-border: var(--bs-danger);
    --edge-btn-hover-fg: var(--edge-on-danger);
    --edge-btn-hover-bg: color-mix(in srgb, var(--bs-danger) 86%, var(--edge-hover-mix));
    --edge-btn-hover-border: var(--edge-btn-hover-bg);
}

.btn-warning {
    --edge-btn-fg: var(--edge-on-warning);
    --edge-btn-bg: var(--bs-warning);
    --edge-btn-border: var(--bs-warning);
    --edge-btn-hover-fg: var(--edge-on-warning);
    --edge-btn-hover-bg: color-mix(in srgb, var(--bs-warning) 86%, var(--edge-hover-mix));
    --edge-btn-hover-border: var(--edge-btn-hover-bg);
}

.btn-info {
    --edge-btn-fg: var(--edge-on-info);
    --edge-btn-bg: var(--bs-info);
    --edge-btn-border: var(--bs-info);
    --edge-btn-hover-fg: var(--edge-on-info);
    --edge-btn-hover-bg: color-mix(in srgb, var(--bs-info) 86%, var(--edge-hover-mix));
    --edge-btn-hover-border: var(--edge-btn-hover-bg);
}

.btn-outline-primary {
    --edge-btn-fg: var(--bs-link-color);
    --edge-btn-border: rgba(var(--bs-primary-rgb), 0.45);
    --edge-btn-hover-fg: var(--bs-link-hover-color);
    --edge-btn-hover-bg: rgba(var(--bs-primary-rgb), 0.12);
    --edge-btn-hover-border: rgba(var(--bs-primary-rgb), 0.6);
}

.btn-outline-secondary,
.btn-outline-light,
.btn-outline-dark {
    --edge-btn-fg: var(--edge-text-2);
    --edge-btn-border: var(--edge-line-strong);
    --edge-btn-hover-fg: var(--edge-text);
    --edge-btn-hover-bg: rgba(var(--edge-text-rgb), 0.06);
    --edge-btn-hover-border: var(--edge-line-strong);
}

.btn-outline-success {
    --edge-btn-fg: var(--bs-success);
    --edge-btn-border: rgba(var(--bs-success-rgb), 0.45);
    --edge-btn-hover-bg: rgba(var(--bs-success-rgb), 0.12);
    --edge-btn-hover-border: rgba(var(--bs-success-rgb), 0.6);
}

.btn-outline-danger {
    --edge-btn-fg: var(--bs-danger);
    --edge-btn-border: rgba(var(--bs-danger-rgb), 0.45);
    --edge-btn-hover-bg: rgba(var(--bs-danger-rgb), 0.12);
    --edge-btn-hover-border: rgba(var(--bs-danger-rgb), 0.6);
}

.btn-outline-warning {
    --edge-btn-fg: var(--bs-warning);
    --edge-btn-border: rgba(var(--bs-warning-rgb), 0.45);
    --edge-btn-hover-bg: rgba(var(--bs-warning-rgb), 0.12);
    --edge-btn-hover-border: rgba(var(--bs-warning-rgb), 0.6);
}

.btn-outline-info {
    --edge-btn-fg: var(--bs-info);
    --edge-btn-border: rgba(var(--bs-info-rgb), 0.45);
    --edge-btn-hover-bg: rgba(var(--bs-info-rgb), 0.12);
    --edge-btn-hover-border: rgba(var(--bs-info-rgb), 0.6);
}

.btn-link {
    --edge-btn-fg: var(--bs-link-color);
    --edge-btn-hover-fg: var(--bs-link-hover-color);
    font-weight: 560;
    text-decoration: none;
}

:is(.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-light, .btn-dark,
    .btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger,
    .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark, .btn-link) {
    color: var(--edge-btn-fg);
    background-color: var(--edge-btn-bg);
    border-color: var(--edge-btn-border);
}

:is(.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-light, .btn-dark,
    .btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger,
    .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark, .btn-link):is(:hover, :focus, :active, .active),
.btn-check:is(:focus, :checked, :active) + :is(.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-light, .btn-dark,
    .btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger,
    .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark),
.show > :is(.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-light, .btn-dark,
    .btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger,
    .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark).dropdown-toggle {
    color: var(--edge-btn-hover-fg);
    background-color: var(--edge-btn-hover-bg);
    border-color: var(--edge-btn-hover-border);
}

/* A checked toggle reads as selected, not merely hovered. */
.btn-check:checked + :is(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger,
    .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark) {
    color: var(--edge-text);
    background-color: rgba(var(--bs-primary-rgb), 0.16);
    border-color: rgba(var(--bs-primary-rgb), 0.55);
}

:is(.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-light, .btn-dark,
    .btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger,
    .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark, .btn-link):is(:disabled, .disabled),
fieldset:disabled .btn {
    color: var(--edge-btn-fg);
    background-color: var(--edge-btn-bg);
    border-color: var(--edge-btn-border);
    opacity: 0.5;
}

.btn:focus,
.btn:active:focus,
.btn-check:focus + .btn,
:is(.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-light, .btn-dark,
    .btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger,
    .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark):is(:focus, :active:focus) {
    box-shadow: 0 0 0 0.2rem var(--theme-focus-ring-color);
}

.btn:focus:not(:focus-visible) { box-shadow: none; }

/* =================================================================
   Cards
   ================================================================= */
.card {
    border-color: var(--theme-card-border);
    border-radius: var(--edge-radius-lg);
    background-color: var(--theme-card-bg);
}

.card-header {
    background-color: var(--edge-card-header-bg);
    border-bottom-color: var(--bs-border-color);
    font-weight: 620;
}

.card-footer {
    background-color: var(--edge-card-header-bg);
    border-top-color: var(--bs-border-color);
}

.card-header:first-child { border-radius: calc(var(--edge-radius-lg) - 1px) calc(var(--edge-radius-lg) - 1px) 0 0; }
.card-footer:last-child { border-radius: 0 0 calc(var(--edge-radius-lg) - 1px) calc(var(--edge-radius-lg) - 1px); }
.card-img-top { border-top-left-radius: calc(var(--edge-radius-lg) - 1px); border-top-right-radius: calc(var(--edge-radius-lg) - 1px); }
.card > .list-group:first-child { border-top-left-radius: calc(var(--edge-radius-lg) - 1px); border-top-right-radius: calc(var(--edge-radius-lg) - 1px); }
.card > .list-group:last-child { border-bottom-left-radius: calc(var(--edge-radius-lg) - 1px); border-bottom-right-radius: calc(var(--edge-radius-lg) - 1px); }

.card-title { font-weight: 640; letter-spacing: -0.015em; }

/* Colored card headers (bg-success text-white, ...) become tinted bands so
   they stay readable on the pale dark-theme accents. */
.card-header:is(.bg-primary, .bg-success, .bg-danger, .bg-warning, .bg-info, .bg-secondary, .bg-dark) {
    color: var(--edge-text) !important;
}

.card-header.bg-primary { background-color: rgba(var(--bs-primary-rgb), 0.14) !important; border-bottom-color: rgba(var(--bs-primary-rgb), 0.28); }
.card-header.bg-success { background-color: rgba(var(--bs-success-rgb), 0.12) !important; border-bottom-color: rgba(var(--bs-success-rgb), 0.28); }
.card-header.bg-danger { background-color: rgba(var(--bs-danger-rgb), 0.12) !important; border-bottom-color: rgba(var(--bs-danger-rgb), 0.3); }
.card-header.bg-warning { background-color: rgba(var(--bs-warning-rgb), 0.12) !important; border-bottom-color: rgba(var(--bs-warning-rgb), 0.3); }
.card-header.bg-info { background-color: rgba(var(--bs-info-rgb), 0.12) !important; border-bottom-color: rgba(var(--bs-info-rgb), 0.28); }
.card-header:is(.bg-secondary, .bg-dark) { background-color: var(--edge-surface-3) !important; }

.card-header:is(.bg-primary, .bg-success, .bg-danger, .bg-warning, .bg-info, .bg-secondary, .bg-dark) :is(.text-white, .text-dark) {
    color: inherit !important;
}

.card:is(.border-primary, .border-success, .border-danger, .border-warning, .border-info) { border-width: 1px; }
.card.border-primary { border-color: rgba(var(--bs-primary-rgb), 0.45) !important; }
.card.border-success { border-color: rgba(var(--bs-success-rgb), 0.4) !important; }
.card.border-danger { border-color: rgba(var(--bs-danger-rgb), 0.45) !important; }
.card.border-warning { border-color: rgba(var(--bs-warning-rgb), 0.45) !important; }
.card.border-info { border-color: rgba(var(--bs-info-rgb), 0.45) !important; }

[data-theme="dark"] .shadow,
[data-theme="dark"] .shadow-lg { box-shadow: 0 18px 44px rgba(0, 0, 0, 0.4) !important; }

.rounded { border-radius: var(--edge-radius) !important; }
.rounded-3 { border-radius: 10px !important; }

/* =================================================================
   Forms
   ================================================================= */
.form-control,
.form-select {
    border-color: var(--theme-input-border);
    border-radius: var(--edge-radius);
}

.form-control-sm,
.form-select-sm { border-radius: var(--edge-radius-sm); }

.form-control-lg,
.form-select-lg { border-radius: 10px; }

.form-control:focus,
.form-select:focus {
    border-color: rgba(var(--bs-primary-rgb), 0.7);
    box-shadow: 0 0 0 0.2rem var(--theme-focus-ring-color);
}

.form-label { font-weight: 560; }

.form-floating > label { color: var(--bs-secondary-color); }

.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-select ~ label {
    opacity: 1;
    color: var(--bs-secondary-color);
}

.input-group-text {
    background-color: var(--edge-surface-2);
    border-color: var(--theme-input-border);
    border-radius: var(--edge-radius);
    color: var(--edge-text-2);
}

.form-check-input {
    border-color: var(--theme-input-border);
}

.form-check-input:focus {
    border-color: rgba(var(--bs-primary-rgb), 0.7);
    box-shadow: 0 0 0 0.2rem var(--theme-focus-ring-color);
}

.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

/* On the pale dark-theme violet, check marks and switch knobs go dark. */
[data-theme="dark"] .form-check-input:checked[type="checkbox"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23111018' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}

[data-theme="dark"] .form-check-input:checked[type="radio"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23111018'/%3e%3c/svg%3e");
}

[data-theme="dark"] .form-switch .form-check-input {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%28255, 255, 255, 0.45%29'/%3e%3c/svg%3e");
}

[data-theme="dark"] .form-switch .form-check-input:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23111018'/%3e%3c/svg%3e");
}

.form-control.is-invalid,
.was-validated .form-control:invalid,
.form-select.is-invalid,
.was-validated .form-select:invalid { border-color: var(--bs-danger); }

.form-control.is-valid,
.was-validated .form-control:valid,
.form-select.is-valid,
.was-validated .form-select:valid { border-color: var(--bs-success); }

.invalid-feedback,
.field-validation-error { color: var(--bs-danger); }

.valid-feedback { color: var(--bs-success); }

/* =================================================================
   Tables
   ================================================================= */
.table {
    border-color: var(--bs-border-color);
}

.table > thead th {
    color: var(--edge-muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    vertical-align: bottom;
}

.table > thead th a { color: inherit; text-decoration: none; }
.table > thead th a:hover { color: var(--edge-text); }

/* Bootstrap draws a 2px currentColor rule between table sections. */
.table > :not(:first-child) {
    border-top: 1px solid var(--edge-line-strong);
}

.table > tfoot { border-top-color: var(--edge-line-strong); }

:is(.table-primary, .table-success, .table-danger, .table-warning, .table-info) {
    color: var(--bs-body-color);
    border-color: var(--bs-border-color);
}

.table-primary { --bs-table-bg: rgba(var(--bs-primary-rgb), 0.1); --bs-table-striped-bg: rgba(var(--bs-primary-rgb), 0.14); --bs-table-hover-bg: rgba(var(--bs-primary-rgb), 0.16); }
.table-success { --bs-table-bg: rgba(var(--bs-success-rgb), 0.1); --bs-table-striped-bg: rgba(var(--bs-success-rgb), 0.14); --bs-table-hover-bg: rgba(var(--bs-success-rgb), 0.16); }
.table-danger { --bs-table-bg: rgba(var(--bs-danger-rgb), 0.1); --bs-table-striped-bg: rgba(var(--bs-danger-rgb), 0.14); --bs-table-hover-bg: rgba(var(--bs-danger-rgb), 0.16); }
.table-warning { --bs-table-bg: rgba(var(--bs-warning-rgb), 0.1); --bs-table-striped-bg: rgba(var(--bs-warning-rgb), 0.14); --bs-table-hover-bg: rgba(var(--bs-warning-rgb), 0.16); }
.table-info { --bs-table-bg: rgba(var(--bs-info-rgb), 0.1); --bs-table-striped-bg: rgba(var(--bs-info-rgb), 0.14); --bs-table-hover-bg: rgba(var(--bs-info-rgb), 0.16); }

/* =================================================================
   Dropdowns
   ================================================================= */
.dropdown-menu {
    padding: 6px;
    border-color: var(--theme-dropdown-border);
    border-radius: 10px;
    background-color: var(--theme-dropdown-bg);
    box-shadow: var(--edge-menu-shadow);
    font-size: 0.86rem;
}

.dropdown-item {
    padding: 0.45rem 0.7rem;
    border-radius: var(--edge-radius-sm);
    color: var(--theme-dropdown-link-color);
}

.dropdown-item:hover,
.dropdown-item:focus {
    color: var(--edge-text);
    background-color: var(--theme-dropdown-link-hover-bg);
}

.dropdown-item.active,
.dropdown-item:active {
    color: var(--edge-text);
    background-color: rgba(var(--bs-primary-rgb), 0.16);
}

.dropdown-item.text-muted:hover { color: var(--edge-text) !important; }

.dropdown-divider {
    margin: 6px 4px;
    border-top-color: var(--bs-border-color);
}

.dropdown-header {
    color: var(--edge-faint);
    font-size: 0.66rem;
    font-weight: 740;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

/* =================================================================
   Tabs, pills, pagination, list groups
   ================================================================= */
.nav-tabs {
    gap: 4px;
    border-bottom-color: var(--bs-border-color);
}

.nav-tabs .nav-link {
    margin-bottom: -1px;
    padding: 0.6rem 0.9rem;
    color: var(--edge-muted);
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    font-weight: 560;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
    color: var(--edge-text);
    border-color: transparent;
    border-bottom-color: var(--edge-line-strong);
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    color: var(--edge-text);
    background-color: transparent;
    border-color: transparent;
    border-bottom-color: var(--bs-primary);
}

.nav-pills .nav-link {
    color: var(--edge-text-2);
    border-radius: var(--edge-radius);
    font-weight: 560;
}

.nav-pills .nav-link:hover { color: var(--edge-text); }

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: var(--edge-text);
    background-color: rgba(var(--bs-primary-rgb), 0.16);
    box-shadow: inset 0 0 0 1px rgba(var(--bs-primary-rgb), 0.35);
}

.page-link {
    color: var(--theme-pagination-color);
    background-color: var(--theme-pagination-bg);
    border-color: var(--theme-pagination-border);
}

.page-link:hover,
.page-link:focus {
    color: var(--edge-text);
    background-color: var(--theme-pagination-hover-bg);
    border-color: var(--theme-pagination-border);
    box-shadow: none;
}

.page-item.active .page-link {
    color: var(--theme-pagination-active-color);
    background-color: var(--theme-pagination-active-bg);
    border-color: var(--theme-pagination-active-bg);
}

.page-item.disabled .page-link {
    color: var(--theme-pagination-disabled-color);
    background-color: var(--theme-pagination-disabled-bg);
    border-color: var(--theme-pagination-border);
}

.page-item:first-child .page-link { border-radius: var(--edge-radius) 0 0 var(--edge-radius); }
.page-item:last-child .page-link { border-radius: 0 var(--edge-radius) var(--edge-radius) 0; }

.list-group { border-radius: var(--edge-radius-lg); }

.list-group-item-action { color: var(--edge-text-2); }

.list-group-item-action:hover,
.list-group-item-action:focus {
    color: var(--edge-text);
    background-color: var(--theme-table-row-hover);
}

.list-group-item.active {
    color: var(--edge-text);
    background-color: rgba(var(--bs-primary-rgb), 0.16);
    border-color: rgba(var(--bs-primary-rgb), 0.35);
}

/* =================================================================
   Badges, progress, accordion, modals, tooltips
   ================================================================= */
.badge {
    border-radius: var(--edge-radius-sm);
    font-weight: 650;
    letter-spacing: 0.01em;
}

/* Tinted rather than solid: keeps the dark-theme pastels readable and
   matches the soft chips on sweepsedge.com. */
.badge.bg-primary { color: var(--bs-link-color); background-color: rgba(var(--bs-primary-rgb), 0.16) !important; box-shadow: inset 0 0 0 1px rgba(var(--bs-primary-rgb), 0.3); }
.badge.bg-success { color: var(--bs-success); background-color: rgba(var(--bs-success-rgb), 0.14) !important; box-shadow: inset 0 0 0 1px rgba(var(--bs-success-rgb), 0.3); }
.badge.bg-danger { color: var(--bs-danger); background-color: rgba(var(--bs-danger-rgb), 0.14) !important; box-shadow: inset 0 0 0 1px rgba(var(--bs-danger-rgb), 0.32); }
.badge.bg-warning { color: var(--bs-warning); background-color: rgba(var(--bs-warning-rgb), 0.14) !important; box-shadow: inset 0 0 0 1px rgba(var(--bs-warning-rgb), 0.32); }
.badge.bg-info { color: var(--bs-info); background-color: rgba(var(--bs-info-rgb), 0.14) !important; box-shadow: inset 0 0 0 1px rgba(var(--bs-info-rgb), 0.3); }
.badge.bg-secondary { color: var(--edge-text-2); background-color: rgba(var(--edge-text-rgb), 0.07) !important; box-shadow: inset 0 0 0 1px var(--edge-line); }
.badge.bg-light { color: var(--edge-text-2); background-color: var(--edge-surface-2) !important; box-shadow: inset 0 0 0 1px var(--edge-line); }
.badge.bg-dark { color: #f2f1f5; background-color: #17171f !important; }

/* Bootstrap 5.3 helpers some pages use; not in the bundled 5.1 build. */
.bg-primary-subtle { background-color: rgba(var(--bs-primary-rgb), 0.14) !important; }
.bg-success-subtle { background-color: rgba(var(--bs-success-rgb), 0.14) !important; }
.bg-danger-subtle { background-color: rgba(var(--bs-danger-rgb), 0.14) !important; }
.bg-warning-subtle { background-color: rgba(var(--bs-warning-rgb), 0.14) !important; }
.bg-info-subtle { background-color: rgba(var(--bs-info-rgb), 0.14) !important; }
.bg-secondary-subtle { background-color: rgba(var(--edge-text-rgb), 0.07) !important; }
.text-primary-emphasis { color: var(--bs-link-color) !important; }
.text-success-emphasis { color: var(--bs-success) !important; }
.text-danger-emphasis { color: var(--bs-danger) !important; }
.text-warning-emphasis { color: var(--bs-warning) !important; }
.text-info-emphasis { color: var(--bs-info) !important; }
.text-body-emphasis { color: var(--edge-text) !important; }

.progress {
    border-radius: 999px;
    background-color: rgba(var(--edge-text-rgb), 0.08);
}

.progress-bar { background-color: var(--bs-primary); }

.accordion-item {
    border-color: var(--bs-border-color);
}

.accordion-item:first-of-type,
.accordion-item:first-of-type .accordion-button { border-top-left-radius: var(--edge-radius-lg); border-top-right-radius: var(--edge-radius-lg); }
.accordion-item:last-of-type,
.accordion-item:last-of-type .accordion-button.collapsed { border-bottom-left-radius: var(--edge-radius-lg); border-bottom-right-radius: var(--edge-radius-lg); }

.accordion-button {
    font-weight: 600;
}

.accordion-button:not(.collapsed) {
    box-shadow: inset 0 -1px 0 var(--bs-border-color);
}

.accordion-button:focus {
    border-color: rgba(var(--bs-primary-rgb), 0.6);
    box-shadow: 0 0 0 0.2rem var(--theme-focus-ring-color);
}

.modal-content {
    border-radius: 16px;
    box-shadow: var(--edge-menu-shadow);
}

.modal-header { border-bottom-color: var(--bs-border-color); }
.modal-footer { border-top-color: var(--bs-border-color); }
.modal-title { font-weight: 640; letter-spacing: -0.02em; }
[data-theme="dark"] .modal-backdrop.show { opacity: 0.7; }

.tooltip-inner { border-radius: var(--edge-radius-sm); font-size: 0.78rem; }

/* =================================================================
   Page primitives (landing and sign-in pages)
   Class-for-class ports of product-page.module.css on sweepsedge.com.
   ================================================================= */
.edge-page {
    --edge-accent: var(--edge-violet);
    --edge-accent-rgb: var(--edge-violet-rgb);
}

/* Inline icons default to text size; specific slots below size them up.
   :where() keeps this at zero specificity so those rules always win. */
:where(.edge-page) svg {
    flex: 0 0 auto;
    width: 1.15em;
    height: 1.15em;
}

.edge-accent-aqua { --edge-accent: var(--edge-aqua); --edge-accent-rgb: var(--edge-aqua-rgb); }
.edge-accent-coral { --edge-accent: var(--edge-coral); --edge-accent-rgb: var(--edge-coral-rgb); }
.edge-accent-violet { --edge-accent: var(--edge-violet); --edge-accent-rgb: var(--edge-violet-rgb); }

.edge-kicker {
    color: var(--edge-kicker);
    font-size: 0.69rem;
    font-weight: 790;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.edge-label {
    color: var(--edge-faint);
    font-size: 0.63rem;
    font-weight: 770;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.edge-hero {
    padding: 64px 0 44px;
}

.edge-hero h1 {
    max-width: 880px;
    margin: 18px 0;
    font-size: clamp(2.5rem, 4.8vw, 4.4rem);
    font-weight: 650;
    line-height: 1.02;
    letter-spacing: -0.05em;
}

.edge-lede {
    max-width: 660px;
    margin: 0;
    color: var(--edge-muted);
    font-size: 1.05rem;
    line-height: 1.7;
}

.edge-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 11px;
    margin-top: 30px;
}

.edge-cta-primary,
.edge-cta-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 52px;
    padding: 0 20px;
    border: 1px solid transparent;
    border-radius: var(--edge-radius);
    font-size: 0.84rem;
    font-weight: 680;
    text-decoration: none;
    transition: transform 150ms ease, border-color 150ms ease, background-color 150ms ease;
}

.edge-cta-primary:hover,
.edge-cta-secondary:hover { transform: translateY(-1px); }

.edge-cta-primary {
    color: var(--edge-on-accent);
    background: var(--edge-accent-strong);
}

.edge-cta-primary:hover,
.edge-cta-primary:focus-visible {
    color: var(--edge-on-accent);
    background: var(--edge-accent-hover);
}

.edge-cta-secondary {
    color: var(--edge-text);
    border-color: var(--edge-line);
    background: var(--edge-surface-2);
}

.edge-cta-secondary:hover,
.edge-cta-secondary:focus-visible {
    color: var(--edge-text);
    border-color: var(--edge-line-strong);
}

.edge-cta-primary svg,
.edge-cta-secondary svg,
.edge-inline-link svg { width: 17px; height: 17px; flex: 0 0 auto; }

.edge-inline-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--bs-link-color);
    font-size: 0.8rem;
    font-weight: 700;
    text-decoration: none;
}

.edge-inline-link:hover { color: var(--bs-link-hover-color); }

.edge-note {
    display: block;
    margin-top: 17px;
    color: var(--edge-faint);
    font-size: 0.7rem;
}

.edge-facts {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 0;
    border-top: 1px solid var(--edge-line);
    border-bottom: 1px solid var(--edge-line);
}

.edge-facts div { padding: 22px 20px 22px 0; border-right: 1px solid var(--edge-line); }
.edge-facts div + div { padding-left: 20px; }
.edge-facts div:last-child { border-right: 0; }

.edge-facts dt {
    color: var(--edge-faint);
    font-size: 0.62rem;
    font-weight: 770;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.edge-facts dd {
    margin: 8px 0 0;
    color: var(--edge-text);
    font-size: 0.92rem;
    font-weight: 600;
    line-height: 1.4;
}

.edge-section {
    padding: 84px 0;
    border-bottom: 1px solid var(--edge-line);
}

.edge-section-heading {
    max-width: 760px;
    margin-bottom: 44px;
}

.edge-section-heading h2 {
    margin: 14px 0 0;
    font-size: clamp(1.9rem, 3.2vw, 2.9rem);
    font-weight: 620;
    line-height: 1.08;
    letter-spacing: -0.045em;
}

.edge-section-heading > p {
    max-width: 640px;
    margin: 18px 0 0;
    color: var(--edge-muted);
    font-size: 0.92rem;
    line-height: 1.7;
}

/* Full-width tinted band: the "Free tracking" section on sweepsedge.com */
.edge-band {
    border-top: 1px solid var(--edge-band-line);
    border-bottom: 1px solid var(--edge-band-line);
    background: var(--edge-band-bg);
}

.edge-band .edge-section { border-bottom: 0; }

.edge-benefits {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.edge-benefits li {
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: 12px;
    padding: 22px;
    border: 1px solid var(--edge-line);
    border-radius: var(--edge-radius-lg);
    background: var(--edge-surface);
}

.edge-benefits li > svg {
    width: 20px;
    height: 20px;
    margin-top: 2px;
    color: var(--edge-accent);
}

.edge-benefits strong {
    display: block;
    font-size: 0.98rem;
    font-weight: 640;
    letter-spacing: -0.015em;
}

.edge-benefits p {
    margin: 8px 0 0;
    color: var(--edge-text-2);
    font-size: 0.82rem;
    line-height: 1.6;
}

.edge-steps {
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--edge-line);
}

.edge-steps li {
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 20px;
    padding: 24px 0;
    border-bottom: 1px solid var(--edge-line);
}

.edge-steps li > span {
    padding-top: 3px;
    color: var(--edge-accent);
    font: 700 0.72rem var(--edge-font-mono);
}

.edge-steps strong { display: block; font-size: 1rem; font-weight: 640; }

.edge-steps p {
    max-width: 720px;
    margin: 7px 0 0;
    color: var(--edge-text-2);
    font-size: 0.84rem;
    line-height: 1.6;
}

.edge-steps code { font-size: 0.8em; }

.edge-metrics {
    margin: 0;
    border-top: 1px solid var(--edge-line);
}

.edge-metrics div {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 14px;
    padding: 20px 0;
    border-bottom: 1px solid var(--edge-line);
}

.edge-metrics dt {
    color: var(--edge-aqua);
    font: 700 0.72rem var(--edge-font-mono);
}

.edge-metrics dd {
    margin: 0;
    color: var(--edge-text-2);
    font-size: 0.84rem;
    line-height: 1.55;
}

.edge-split {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 90px;
    align-items: center;
}

.edge-products {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.edge-product {
    display: flex;
    flex-direction: column;
    padding: 28px;
    border: 1px solid var(--edge-line);
    border-top: 3px solid var(--edge-accent);
    border-radius: 16px;
    background: var(--edge-surface);
}

.edge-product-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    margin-bottom: 20px;
    color: var(--edge-accent);
    border: 1px solid var(--edge-line);
    border-radius: 10px;
    background: var(--edge-surface-2);
}

.edge-product-icon svg { width: 21px; height: 21px; }

.edge-product-category {
    color: var(--edge-accent);
    font-size: 0.63rem;
    font-weight: 770;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.edge-product h3 {
    margin: 8px 0 0;
    font-size: 1.6rem;
    font-weight: 620;
    letter-spacing: -0.04em;
}

.edge-product > p {
    margin: 14px 0 0;
    color: var(--edge-text-2);
    font-size: 0.86rem;
    line-height: 1.65;
}

.edge-product-footer {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: auto;
    padding-top: 24px;
}

.edge-product-pricing {
    color: var(--edge-muted);
    font-size: 0.74rem;
    font-weight: 650;
}

.edge-product-primary,
.edge-product-details {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    border-radius: var(--edge-radius);
    font-size: 0.8rem;
    font-weight: 700;
    text-decoration: none;
    transition: transform 150ms ease, background-color 150ms ease;
}

.edge-product-primary {
    min-height: 46px;
    color: var(--edge-on-accent);
    background: var(--edge-accent);
}

.edge-product-primary:hover {
    color: var(--edge-on-accent);
    transform: translateY(-1px);
}

[data-theme="light"] .edge-product-primary { color: #ffffff; }

.edge-product-details {
    min-height: 40px;
    color: var(--edge-text-2);
    border: 1px solid var(--edge-line);
}

.edge-product-details:hover {
    color: var(--edge-text);
    background: rgba(var(--edge-text-rgb), 0.05);
}

.edge-final-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    padding: 72px 0;
}

.edge-final-cta h2 {
    max-width: 620px;
    margin: 0;
    font-size: clamp(1.9rem, 3.2vw, 2.9rem);
    font-weight: 620;
    line-height: 1.08;
    letter-spacing: -0.045em;
}

.edge-final-cta p {
    max-width: 560px;
    margin: 14px 0 0;
    color: var(--edge-muted);
    font-size: 0.92rem;
    line-height: 1.65;
}

.edge-final-cta .edge-actions { flex: 0 0 auto; margin-top: 0; }

.edge-operator {
    padding: 28px 0 8px;
    color: var(--edge-faint);
    font-size: 0.72rem;
    text-align: center;
}

.edge-operator a { color: inherit; }

/* Related cards (.relatedCard on sweepsedge.com product pages) */
.edge-related-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}

.edge-related-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 24px;
    color: var(--edge-text);
    border: 1px solid var(--edge-line);
    border-radius: var(--edge-radius-lg);
    background: var(--edge-surface);
    text-decoration: none;
    transition: transform 150ms ease, border-color 150ms ease;
}

.edge-related-card:hover {
    color: var(--edge-text);
    border-color: var(--edge-line-strong);
    transform: translateY(-2px);
}

.edge-related-card .edge-product-icon { margin-bottom: 18px; color: var(--edge-violet); }
.edge-related-card strong { font-size: 1.2rem; font-weight: 640; letter-spacing: -0.03em; }

.edge-related-card p {
    margin: 10px 0 0;
    color: var(--edge-text-2);
    font-size: 0.84rem;
    line-height: 1.6;
}

.edge-related-card em {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
    color: var(--bs-link-color);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 700;
}

.edge-related-card em svg { width: 16px; height: 16px; }

/* Sign-in / register */
.edge-auth {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 440px);
    gap: 72px;
    align-items: start;
    padding: 24px 0 16px;
}

.edge-auth-intro h1 {
    margin: 16px 0 16px;
    font-size: clamp(2.1rem, 4vw, 3.4rem);
    font-weight: 650;
    line-height: 1.04;
    letter-spacing: -0.05em;
}

.edge-auth-intro .edge-metrics { max-width: 520px; margin-top: 32px; }

.edge-auth-card {
    padding: 28px;
    border: 1px solid var(--edge-line);
    border-radius: 16px;
    background: var(--edge-surface);
}

.edge-auth-card h2 {
    margin: 0 0 6px;
    font-size: 1.35rem;
    font-weight: 640;
    letter-spacing: -0.03em;
}

.edge-auth-card .edge-auth-sub {
    margin: 0 0 22px;
    color: var(--edge-muted);
    font-size: 0.86rem;
}

.edge-auth-card .form-control { background-color: var(--theme-input-bg); }

.edge-auth-providers {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.edge-auth-providers .btn img { display: block; height: 40px; width: auto; }

.edge-auth-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 22px 0;
    color: var(--edge-faint);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.edge-auth-divider::before,
.edge-auth-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--edge-line);
}

.edge-auth-links {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--edge-line);
    font-size: 0.84rem;
}

.edge-auth-links p { margin: 0; color: var(--edge-muted); }

@media (max-width: 1040px) {
    .edge-products { grid-template-columns: 1fr; max-width: 720px; }
    .edge-benefits { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
    .edge-auth { grid-template-columns: 1fr; gap: 36px; }
    .edge-auth-card { max-width: 520px; }
}

@media (max-width: 820px) {
    .edge-facts { grid-template-columns: repeat(2, 1fr); }
    .edge-facts div:nth-child(2) { border-right: 0; }
    .edge-facts div:nth-child(-n + 2) { border-bottom: 1px solid var(--edge-line); }
    .edge-facts div:nth-child(odd) { padding-left: 0; }
    .edge-facts div:nth-child(even) { padding-left: 20px; }
    .edge-split { grid-template-columns: 1fr; gap: 44px; }
    .edge-related-grid { grid-template-columns: 1fr; }
    .edge-final-cta { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 620px) {
    .edge-hero { padding: 40px 0 32px; }
    .edge-hero h1 { font-size: 2.3rem; }
    .edge-actions { display: grid; width: 100%; }
    .edge-cta-primary,
    .edge-cta-secondary { width: 100%; }
    .edge-inline-link { justify-content: center; min-height: 38px; }
    .edge-section { padding: 64px 0; }
    .edge-benefits { grid-template-columns: 1fr; }
    .edge-steps li { grid-template-columns: 34px 1fr; gap: 12px; }
    .edge-metrics div { grid-template-columns: 1fr; gap: 6px; }
    .edge-product { padding: 22px; }
    .edge-final-cta { padding: 56px 0; }
    .edge-auth-card { padding: 22px; }
}

@media (prefers-reduced-motion: reduce) {
    .edge-btn:hover,
    .btn-lg:hover,
    .edge-cta-primary:hover,
    .edge-cta-secondary:hover,
    .edge-product-primary:hover,
    .edge-related-card:hover { transform: none; }
}

@media print {
    .edge-header,
    .edge-footer { display: none !important; }
}

/* Signed-out "Log in" lives in the menu panel once the header button hides. */
.edge-nav-login { display: none; }

@media (max-width: 419.98px) {
    .edge-nav-login { display: block; }
}
