/* oembrain brand — palette lifted from OEMDRIVE (Phoenix theme) */
:root {
    --oem-primary: #3874ff;
    --oem-primary-dark: #004dff;
    --oem-primary-darker: #003cc7;
    --oem-success: #25b003;
    --oem-warning: #e5780b;
    --oem-danger: #ec1f00;
    --oem-info: #0097eb;
    --oem-accent: #f8d038;      /* OEMDRIVE registration-plate yellow */
    --oem-accent-2: #f5ca2e;

    --oem-ink: #141824;         /* emphasis text */
    --oem-body: #31374a;        /* body text */
    --oem-muted: #525b75;       /* gray-700 */
    --oem-line: #e3e6ed;        /* borders */
    --oem-bg: #f5f7fa;          /* body bg */
    --oem-navy: #0b1739;        /* dark surfaces */
    --app-card-inset: 1.375rem;
    --app-card-inset-block: 1.25rem;
    --app-card-inset-compact: .875rem;
    --app-section-gap: 1.25rem;

    --bs-primary: var(--oem-primary);
    --bs-primary-rgb: 56, 116, 255;
    --bs-link-color: var(--oem-primary-dark);
    --bs-link-hover-color: var(--oem-primary-darker);
    --bs-body-color: var(--oem-body);
}

body {
    background-color: var(--oem-bg);
    color: var(--oem-body);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

h1, h2, h3, h4, h5, h6 { color: var(--oem-ink); }

.brand-wordmark {
    display: inline-flex; align-items: baseline; color: inherit; font-weight: 800;
    letter-spacing: -.035em; line-height: 1; text-decoration: none;
}
.brand-oem { color: var(--oem-primary); }
.brand-brain { color: var(--oem-ink); }
.navbar-dark .brand-oem, .site-footer .brand-oem, .app-sidebar .brand-oem, .app-mobile-header .brand-oem { color: #85a9ff; }
.navbar-dark .brand-brain, .site-footer .brand-brain, .app-sidebar .brand-brain, .app-mobile-header .brand-brain { color: #fff; }
.brand-wordmark:hover .brand-oem { color: #6792ff; }
.brand-wordmark:hover .brand-brain { color: inherit; }

/* Buttons */
.btn-primary {
    --bs-btn-bg: var(--oem-primary);
    --bs-btn-border-color: var(--oem-primary);
    --bs-btn-hover-bg: var(--oem-primary-dark);
    --bs-btn-hover-border-color: var(--oem-primary-dark);
    --bs-btn-active-bg: var(--oem-primary-darker);
    --bs-btn-active-border-color: var(--oem-primary-darker);
}
.btn-outline-primary {
    --bs-btn-color: var(--oem-primary-dark);
    --bs-btn-border-color: var(--oem-primary);
    --bs-btn-hover-bg: var(--oem-primary);
    --bs-btn-hover-border-color: var(--oem-primary);
}
.text-primary { color: var(--oem-primary) !important; }
.bg-primary { background-color: var(--oem-primary) !important; }

/* Navbars */
.navbar-public, .app-topbar { background-color: var(--oem-navy); }
.navbar-public .nav-link, .app-topbar .nav-link { color: rgba(255,255,255,.82); }
.navbar-public .nav-link:hover, .app-topbar .nav-link:hover { color: #fff; }
.app-topbar .nav-link.active { color: #fff; font-weight: 600; }

/* Hero */
.hero {
    background: radial-gradient(1200px 500px at 80% -10%, rgba(56,116,255,.28), transparent 60%),
                linear-gradient(180deg, var(--oem-navy) 0%, #0e1e46 100%);
    color: #fff;
    padding: 5rem 0 4.5rem;
}
.hero h1 { color: #fff; font-weight: 800; letter-spacing: -.02em; }
.hero .lead { color: rgba(255,255,255,.82); }
.hero .reg-chip {
    display: inline-flex; align-items: center; gap: .5rem;
    background: linear-gradient(to bottom, var(--oem-accent) 0%, var(--oem-accent-2) 100%);
    color: #111; font-weight: 700; border: 1px solid #000; border-radius: 6px;
    padding: .35rem .8rem; font-family: "Charles Wright", helvetica, sans-serif; letter-spacing: .04em;
}

/* Public landing hero and decorative diary preview */
.landing-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(4rem, 8vw, 6.5rem) 0;
    background:
        radial-gradient(700px 430px at 88% 18%, rgba(214,65,35,.2), transparent 68%),
        radial-gradient(900px 500px at 15% -25%, rgba(56,116,255,.22), transparent 65%),
        linear-gradient(145deg, #101d37 0%, #1a2b4a 58%, #101d37 100%);
}
.landing-hero::after {
    position: absolute; right: -8rem; bottom: -13rem; width: 30rem; height: 30rem;
    border: 1px solid rgba(255,255,255,.06); border-radius: 50%; content: ""; pointer-events: none;
}
.landing-hero .container { position: relative; z-index: 1; }
.landing-hero-copy { max-width: 41rem; }
.landing-hero h1 {
    max-width: 40rem; font-size: clamp(2.4rem,5vw,4.15rem); line-height: 1.04;
    letter-spacing: -.045em; text-wrap: balance;
}
.landing-hero .lead { max-width: 36rem; color: #d3dbeb; font-size: clamp(1.05rem,2vw,1.22rem); line-height: 1.65; }
.landing-hero-eyebrow { box-shadow: 0 5px 15px rgba(0,0,0,.18); font-size: .78rem; }
.landing-hero .btn { min-height: 50px; border-radius: 8px; font-size: .95rem; font-weight: 700; }
.landing-hero .btn-primary {
    --bs-btn-bg: #d64123;
    --bs-btn-border-color: #d64123;
    --bs-btn-hover-bg: #b9331b;
    --bs-btn-hover-border-color: #b9331b;
    --bs-btn-active-bg: #9f2c18;
    --bs-btn-active-border-color: #9f2c18;
    box-shadow: 0 8px 24px rgba(214,65,35,.28);
}
.landing-hero .btn-outline-light { --bs-btn-color: #fff; --bs-btn-border-color: rgba(255,255,255,.48); }
.landing-hero-trust { color: #bec9dc; }
.landing-hero-trust i { color: #9fc0ff; }
.landing-preview-wrap { position: relative; max-width: 490px; margin-left: auto; padding: .55rem; }
.landing-preview-wrap::before {
    position: absolute; inset: -1rem; z-index: -1; border-radius: 28px;
    background: linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.025));
    border: 1px solid rgba(255,255,255,.1); content: "";
    transform: rotate(1.5deg);
}
.landing-preview-card {
    overflow: hidden; color: var(--oem-body); background: #fff;
    border: 1px solid rgba(255,255,255,.72); border-radius: 16px;
    box-shadow: 0 28px 65px rgba(2,8,23,.36), 0 4px 12px rgba(2,8,23,.16);
}
.landing-preview-header {
    display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    padding: 1.25rem 1.35rem 1.05rem; background: #fbfcfe; border-bottom: 1px solid #e3e6ed;
}
.landing-preview-header > div { display: flex; flex-direction: column; gap: .25rem; }
.landing-preview-header strong { display: flex; align-items: center; gap: .55rem; color: #182239; font-size: 1.05rem; }
.landing-preview-header strong i { color: #d64123; }
.landing-preview-kicker { color: #626d83; font-size: .65rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.landing-job-count {
    display: inline-flex; align-items: center; min-height: 29px; padding: .3rem .7rem;
    color: #fff; background: #1a2b4a; border-radius: 999px; font-size: .72rem; font-weight: 750;
}
.landing-job-list { padding: .25rem 1.35rem .45rem; }
.landing-job-row {
    display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 1rem; align-items: center;
    min-height: 76px; padding: .9rem 0; border-bottom: 1px solid #e8ebf1;
}
.landing-job-row:last-child { border-bottom: 0; }
.landing-job-details { display: flex; min-width: 0; flex-direction: column; gap: .32rem; }
.landing-job-details > strong { overflow: hidden; color: #182239; font-size: .88rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.landing-job-details > span { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; color: #626d83; font-size: .74rem; }
.landing-reg-plate {
    display: inline-block; padding: .08rem .38rem; color: #161616; background: #ffdd00;
    border: 1px solid #c9aa00; border-radius: 4px; font-size: .66rem; font-weight: 850;
    letter-spacing: .075em; line-height: 1.35;
}
.landing-status {
    display: inline-flex; gap: .42rem; align-items: center; width: max-content; padding: .32rem .58rem;
    border: 1px solid; border-radius: 999px; font-size: .68rem; font-weight: 750; white-space: nowrap;
}
.landing-status i { width: 6px; height: 6px; flex: none; border-radius: 50%; background: currentColor; }
.landing-status-progress { color: #174494; background: #edf3ff; border-color: #c0d3ff; }
.landing-status-parts { color: #754006; background: #fff4e4; border-color: #e9c99e; }
.landing-status-booked { color: #465069; background: #f0f2f6; border-color: #d5dae4; }
.landing-status-done { color: #146c43; background: #eaf7f0; border-color: #b7dfca; }

/* Cards */
.feature-card, .app-card {
    background: #fff; border: 1px solid var(--oem-line); border-radius: 14px;
    box-shadow: 0 1px 2px rgba(20,24,36,.04);
}
.feature-card { padding: 1.5rem; height: 100%; }
.feature-icon {
    width: 44px; height: 44px; border-radius: 10px; display: grid; place-items: center;
    background: rgba(56,116,255,.1); color: var(--oem-primary); font-size: 1.35rem; margin-bottom: 1rem;
}

/* Pricing */
.price-card { border: 1px solid var(--oem-line); border-radius: 16px; background: #fff; padding: 2rem; height: 100%; }
.price-card.featured { border-color: var(--oem-primary); box-shadow: 0 12px 30px rgba(56,116,255,.15); }
.price-amount { font-size: 2.6rem; font-weight: 800; color: var(--oem-ink); }

/* Authenticated app shell */
.layout-app { overflow-x: hidden; }
.app-shell {
    --app-card-inset: 1.375rem;
    --app-card-inset-block: 1.25rem;
    --app-card-inset-compact: .875rem;
    --app-section-gap: 1.25rem;
    display: flex;
    min-height: 100vh;
}
.app-sidebar {
    --bs-offcanvas-width: 270px;
    width: 270px; flex: 0 0 270px; background: var(--oem-navy); color: #fff;
    border-right: 0; box-shadow: 8px 0 30px rgba(11,23,57,.08);
}
.app-sidebar-header { height: 74px; padding: 0 1.25rem; border-bottom: 1px solid rgba(255,255,255,.09); }
.app-sidebar-header .brand-wordmark { font-size: 1.55rem; }
.app-sidebar .offcanvas-body { overflow-y: auto; }
.sidebar-workshop {
    display: flex; align-items: center; gap: .75rem; padding: .7rem; margin-bottom: 1.1rem;
    background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.09); border-radius: 12px;
}
.sidebar-workshop-icon {
    display: grid; place-items: center; width: 38px; height: 38px; flex: none;
    color: #b9ceff; background: rgba(56,116,255,.24); border-radius: 9px;
}
.sidebar-workshop span:last-child { min-width: 0; display: flex; flex-direction: column; }
.sidebar-workshop small, .sidebar-user small { color: rgba(255,255,255,.58); font-size: .72rem; }
.sidebar-workshop strong { overflow: hidden; color: #fff; font-size: .86rem; text-overflow: ellipsis; white-space: nowrap; }
.app-nav { display: grid; gap: .25rem; }
.app-nav-link {
    display: flex; align-items: center; gap: .75rem; min-height: 44px; padding: .65rem .75rem;
    color: rgba(255,255,255,.72); border-radius: 9px; font-size: .92rem; font-weight: 500; text-decoration: none;
}
.app-nav-link i { width: 1.25rem; font-size: 1.05rem; text-align: center; }
.app-nav-link:hover { color: #fff; background: rgba(255,255,255,.08); }
.app-nav-link.active { color: #fff; background: var(--oem-primary); box-shadow: 0 5px 15px rgba(56,116,255,.28); }
.sidebar-footer { padding-top: 1rem; border-top: 1px solid rgba(255,255,255,.1); }
.sidebar-user { display: flex; align-items: center; gap: .7rem; padding: .55rem .65rem; color: #fff; text-decoration: none; }
.sidebar-user > span:last-child { display: flex; min-width: 0; flex-direction: column; }
.sidebar-user strong, .sidebar-user small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-avatar {
    display: grid; place-items: center; width: 34px; height: 34px; flex: none; border-radius: 50%;
    background: #dbe6ff; color: #164dce; font-size: .82rem; font-weight: 800; text-decoration: none;
}
.app-content { min-width: 0; flex: 1; }
.app-mobile-header {
    display: none; height: 64px; padding: 0 1rem; align-items: center; justify-content: space-between;
    background: var(--oem-navy); color: #fff; box-shadow: 0 3px 12px rgba(11,23,57,.12);
}
.app-menu-button { padding: .25rem; color: #fff; border: 0; font-size: 1.45rem; }
.app-main { min-height: 100vh; }
.app-container { max-width: 1440px; margin: auto; padding: 2rem clamp(1rem,3vw,2.5rem); }
.page-eyebrow { color: var(--oem-primary-dark); font-size: .73rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.page-title { margin-bottom: .3rem; font-size: clamp(1.65rem,3vw,2.15rem); font-weight: 750; letter-spacing: -.035em; }
.app-card { overflow: hidden; }
.card-header-clean { padding: 1.1rem 1.25rem; background: #fff; border-bottom: 1px solid var(--oem-line); }
.stat-card {
    display: flex; position: relative; height: 100%; padding: 1.15rem; gap: .9rem; align-items: center;
    background: #fff; color: inherit; border: 1px solid var(--oem-line); border-radius: 13px;
    box-shadow: 0 1px 2px rgba(20,24,36,.03); text-decoration: none;
}
.stat-card:hover { border-color: #b7c9f6; box-shadow: 0 7px 22px rgba(20,24,36,.07); transform: translateY(-1px); }
.stat-icon, .quick-action-icon {
    display: grid; place-items: center; width: 44px; height: 44px; flex: none;
    color: var(--oem-primary-dark); background: #edf3ff; border-radius: 11px; font-size: 1.15rem;
}
.stat-card .stat-value { color: var(--oem-ink); font-size: 1.55rem; font-weight: 750; line-height: 1.15; }
.stat-card .stat-label { color: var(--oem-muted); font-size: .78rem; font-weight: 600; }
.stat-arrow { margin-left: auto; color: #9aa4bc; }
.trial-banner {
    display: flex; align-items: center; gap: 1rem; padding: 1rem 1.2rem; margin-bottom: 1.5rem;
    background: linear-gradient(110deg,#eaf1ff,#f6f9ff); border: 1px solid #c8d8ff; border-radius: 14px;
}
.trial-banner .progress { width: 150px; height: 6px; background: #d4def5; }
.diary-date-nav { display: flex; align-items: center; gap: .45rem; }
.empty-state { max-width: 520px; margin: auto; padding: 3.75rem 1.5rem; text-align: center; }
.empty-state-icon {
    display: grid; place-items: center; width: 66px; height: 66px; margin: 0 auto 1rem;
    color: var(--oem-primary); background: #edf3ff; border-radius: 18px; font-size: 1.7rem;
}
.quick-actions { display: grid; gap: .7rem; }
.quick-action {
    display: flex; align-items: center; gap: .85rem; padding: .8rem; color: var(--oem-ink);
    border: 1px solid var(--oem-line); border-radius: 11px; text-decoration: none;
}
.quick-action:hover { color: var(--oem-primary-dark); border-color: #b7c9f6; background: #f8faff; }
.quick-action small { display: block; color: var(--oem-muted); }
.checklist { list-style: none; margin: 0; padding: 0; }
.checklist li { display: flex; gap: .75rem; padding: .75rem 0; border-bottom: 1px solid var(--oem-line); }
.checklist li:last-child { border: 0; }
.checklist-icon { color: #9ba5ba; }
.checklist-icon.done { color: var(--oem-success); }
.reg-plate {
    display: inline-block; padding: .2rem .55rem; color: #141414; background: var(--oem-accent);
    border: 1px solid #d0a900; border-radius: 5px; font-size: .82rem; font-weight: 800; letter-spacing: .05em;
}
.table-app thead th { padding: .75rem 1rem; color: var(--oem-muted); background: #f8f9fc; border-bottom-color: var(--oem-line); font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; }
.table-app tbody td { padding: .9rem 1rem; border-color: #edf0f5; }
.table-app tbody tr { cursor: pointer; }
.form-control, .form-select { min-height: 44px; border-color: #ccd2df; }
.form-control:focus, .form-select:focus { border-color: var(--oem-primary); box-shadow: 0 0 0 .2rem rgba(56,116,255,.14); }
.form-label { color: var(--oem-ink); font-size: .86rem; font-weight: 650; }
.btn, a, button, input, select, textarea { transition: color .15s, background-color .15s, border-color .15s, box-shadow .15s, transform .15s; }
:focus-visible { outline: 3px solid rgba(56,116,255,.45); outline-offset: 2px; }
.placeholder-panel { padding: clamp(2rem,5vw,4rem); text-align: center; }

/* Auth */
.auth-wrap { min-height: 100vh; display: grid; place-items: center; padding: 2rem 1rem;
    background: radial-gradient(900px 400px at 50% -10%, rgba(56,116,255,.15), transparent 60%), var(--oem-bg); }
.auth-card { width: 100%; max-width: 460px; background: #fff; border: 1px solid var(--oem-line);
    border-radius: 16px; padding: 2.25rem; box-shadow: 0 12px 40px rgba(20,24,36,.08); }

/* Footer */
.site-footer { background: var(--oem-navy); color: #fff; }
.footer-links a { color: rgba(255,255,255,.7); text-decoration: none; line-height: 2; }
.footer-links a:hover { color: #fff; }

/* Status badges */
.badge.bg-warning { color: #111; }

@media (max-width: 991.98px) {
    .landing-hero { text-align: center; }
    .landing-hero-copy, .landing-hero h1, .landing-hero .lead { margin-right: auto; margin-left: auto; }
    .landing-hero-actions { justify-content: center; }
    .landing-preview-wrap { margin-right: auto; margin-left: auto; }
    .app-sidebar { width: var(--bs-offcanvas-width); flex-basis: auto; }
    .app-mobile-header { display: flex; position: sticky; top: 0; z-index: 1020; }
    .app-main { min-height: calc(100vh - 64px); }
    .app-container { padding-top: 1.35rem; }
}
@media (max-width: 575.98px) {
    .landing-hero { padding: 3.5rem 0 4rem; }
    .landing-hero h1 { font-size: clamp(2.15rem,11vw,3rem); }
    .landing-hero-actions { gap: .75rem !important; }
    .landing-hero-actions .btn { width: 100%; }
    .landing-preview-wrap { padding: 0; }
    .landing-preview-wrap::before { inset: -.55rem; }
    .landing-preview-header { padding: 1rem; text-align: left; }
    .landing-job-list { padding-right: 1rem; padding-left: 1rem; }
    .landing-job-row { gap: .65rem; min-height: 72px; }
    .landing-job-details > strong { font-size: .82rem; }
    .landing-status { padding: .3rem .48rem; font-size: .64rem; }
    .auth-card { padding: 1.5rem; }
    .trial-banner { align-items: flex-start; flex-wrap: wrap; }
    .trial-banner .progress { width: 100%; }
    .diary-date-nav { width: 100%; justify-content: space-between; }
    .page-actions { width: 100%; }
    .page-actions .btn { flex: 1; }
}

/* Product workspace — dense, operational UI */
:root {
    --oem-surface: #fff;
    --oem-surface-soft: #f8fafc;
    --oem-line-strong: #d5dae5;
    --oem-subtle: #68718a;
    --oem-sidebar: #101a31;
    --oem-radius-sm: 7px;
    --oem-radius: 10px;
    --oem-radius-lg: 14px;
    --oem-shadow: 0 1px 2px rgba(20,24,36,.04), 0 6px 18px rgba(20,24,36,.035);
}
body { font-size: .9375rem; line-height: 1.5; }
.skip-link { position: fixed; z-index: 2000; top: .75rem; left: .75rem; padding: .65rem 1rem; color: #fff; background: var(--oem-primary-darker); border-radius: 6px; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.brand-wordmark { gap: .55rem; font-size: 1.24rem; align-items: center; letter-spacing: -.045em; }
.brand-symbol { width: 30px; height: 30px; flex: none; }
.app-sidebar {
    --bs-offcanvas-width: 244px;
    --bs-offcanvas-bg: var(--oem-sidebar);
    width: 244px;
    flex-basis: 244px;
    color: #f8faff;
    background-color: var(--oem-sidebar) !important;
    box-shadow: none;
    border-right: 1px solid #23304b;
}
.app-sidebar .offcanvas-header,
.app-sidebar .offcanvas-body { color: #f8faff; background-color: var(--oem-sidebar); }
.app-sidebar .brand-wordmark { color: #fff; }
.app-sidebar .brand-oem { color: #9ab8ff; }
.app-sidebar .brand-brain { color: #fff; }
.app-sidebar .sidebar-workshop { color: #fff; background-color: #172541; border-color: #2c3a56; }
.app-sidebar .sidebar-workshop small,
.app-sidebar .sidebar-user small { color: #aeb9cf; }
.app-sidebar .sidebar-workshop strong,
.app-sidebar .sidebar-user strong { color: #fff; }
.app-sidebar .app-nav-label { color: #aab6cf; }
.app-sidebar .app-nav-link { color: #d4dcef; }
.app-sidebar .app-nav-link:hover,
.app-sidebar .app-nav-link:focus-visible { color: #fff; background-color: #1a2947; }
.app-sidebar .app-nav-link.active,
.app-sidebar .app-nav-link.active:hover,
.app-sidebar .app-nav-link.active:focus-visible { color: #fff; background-color: #244fae; }
.app-sidebar .sidebar-user:hover,
.app-sidebar .sidebar-user:focus-visible { color: #fff; background-color: #1a2947; border-radius: 7px; }
.app-sidebar-header { height: 68px; padding: 0 1rem; }
.app-sidebar-header .brand-wordmark { font-size: 1.28rem; }
.sidebar-workshop { margin-bottom: .75rem; padding: .65rem; border-radius: var(--oem-radius); }
.app-nav { gap: .12rem; }
.app-nav-label { margin: .85rem .7rem .3rem; color: #aab6cf; font-size: .64rem; font-weight: 750; letter-spacing: .105em; text-transform: uppercase; }
.app-nav-link { min-height: 40px; padding: .5rem .7rem; border-radius: 7px; font-size: .875rem; }
.app-nav-link.active { background: #244fae; box-shadow: inset 3px 0 #8fb0ff; }
.app-nav-link:hover { background: #1a2947; }
.sidebar-footer { margin-top: 1rem; }
.app-content { background: var(--oem-bg); }
.app-container { max-width: 1500px; padding: 1.6rem clamp(1rem,2.3vw,2.25rem) 3rem; }
.page-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1.4rem; }
.page-title { margin: .1rem 0 .2rem; font-size: clamp(1.55rem,2vw,1.9rem); font-weight: 760; }
.page-eyebrow, .section-kicker { color: #315fbf; font-size: .68rem; font-weight: 780; letter-spacing: .09em; text-transform: uppercase; }
.back-link { display: inline-flex; gap: .4rem; align-items: center; color: var(--oem-muted); font-size: .8rem; font-weight: 650; text-decoration: none; }
.back-link:hover { color: var(--oem-primary-darker); }
.app-card { border-radius: var(--oem-radius-lg); box-shadow: var(--oem-shadow); }
.section-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.2rem; border-bottom: 1px solid var(--oem-line); }
.section-header h2, .card-header-clean h2 { margin: .1rem 0 0; font-size: 1rem; font-weight: 720; }
.section-header.compact { margin: -1rem -1rem .25rem; }
.section-icon { color: #8994aa; font-size: 1.2rem; }
.form-panel form, .form-panel > .row { padding: 1.2rem; }
.form-panel > form { padding: 1.2rem; }
.form-actions { display: flex; justify-content: flex-end; gap: .6rem; margin: 1.25rem -1.2rem -1.2rem; padding: 1rem 1.2rem; background: var(--oem-surface-soft); border-top: 1px solid var(--oem-line); border-radius: 0 0 var(--oem-radius-lg) var(--oem-radius-lg); }
.form-control, .form-select, .input-group-text { min-height: 42px; border-color: #c8cfdd; border-radius: var(--oem-radius-sm); }
.form-control-lg { min-height: 48px; font-size: 1rem; }
.form-text { color: var(--oem-subtle); font-size: .76rem; }
.form-divider { margin: 1.5rem 0; border-color: var(--oem-line); opacity: 1; }
.settings-switch { padding: .52rem .75rem .52rem 2.8rem; background: var(--oem-surface-soft); border: 1px solid var(--oem-line); border-radius: var(--oem-radius-sm); }
.settings-switch .form-check-input { margin-top: .12rem; margin-left: -2.05rem; }
.metric-strip { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); background: #fff; border: 1px solid var(--oem-line); border-radius: var(--oem-radius-lg); box-shadow: var(--oem-shadow); overflow: hidden; }
.stat-card { min-height: 84px; padding: 1rem 1.1rem; border: 0; border-right: 1px solid var(--oem-line); border-radius: 0; box-shadow: none; }
.stat-card:last-child { border-right: 0; }
.stat-card:hover { z-index: 1; background: #f9fbff; border-color: var(--oem-line); transform: none; box-shadow: inset 0 -2px var(--oem-primary); }
.stat-icon, .quick-action-icon { width: 38px; height: 38px; border-radius: 8px; }
.stat-card .stat-value { font-size: 1.35rem; }
.trial-banner { padding: .8rem 1rem; margin-bottom: 1.25rem; border-radius: var(--oem-radius); }
.diary-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 1rem 1.2rem; }
.today-chip { display: inline-flex; gap: .45rem; align-items: center; padding: .4rem .65rem; color: var(--oem-muted); background: #f7f9fc; border: 1px solid var(--oem-line); border-radius: 7px; font-size: .75rem; }
.today-chip strong { color: var(--oem-ink); }
.diary-filters { display: flex; gap: .35rem; overflow-x: auto; padding: .65rem 1.2rem; border-top: 1px solid var(--oem-line); border-bottom: 1px solid var(--oem-line); }
.diary-filter { flex: none; padding: .35rem .7rem; color: var(--oem-muted); border: 1px solid transparent; border-radius: 999px; font-size: .74rem; font-weight: 700; text-decoration: none; }
.diary-filter:hover { color: var(--oem-primary-darker); background: #f2f6ff; }
.diary-filter.is-active { color: #174494; background: #edf3ff; border-color: #cbdcff; }
.overdue-flag { display: inline-block; margin-left: .35rem; padding: .12rem .35rem; color: #9d270f; background: #fff0ed; border-radius: 4px; font-size: .62rem; font-weight: 750; text-transform: uppercase; }
.status-summary { display: flex; flex-wrap: wrap; gap: .45rem 1.2rem; padding: .65rem 1.2rem; background: #fbfcfe; border-bottom: 1px solid var(--oem-line); }
.status-summary-item { display: inline-flex; align-items: center; gap: .4rem; color: var(--oem-muted); font-size: .75rem; }
.status-summary-item i, .status-chip i { width: 7px; height: 7px; background: #9099aa; border-radius: 50%; }
.status-summary-item strong { color: var(--oem-ink); }
.status-dot-in_progress i, .status-in_progress i { background: var(--oem-primary); }
.status-dot-awaiting_parts i, .status-awaiting_parts i { background: var(--oem-warning); }
.status-dot-done i, .status-done i, .status-active i { background: #198754; }
.status-invoiced i { background: var(--oem-info); }
.status-chip { display: inline-flex; align-items: center; gap: .42rem; width: max-content; padding: .28rem .55rem; color: #384052; background: #f0f2f6; border: 1px solid #dde1e9; border-radius: 999px; font-size: .72rem; font-weight: 700; }
.status-chip.status-in_progress { color: #174494; background: #edf3ff; border-color: #cbdcff; }
.status-chip.status-awaiting_parts { color: #7b4308; background: #fff5e8; border-color: #f2d6b5; }
.status-chip.status-done, .status-chip.status-active { color: #146c43; background: #eaf7f0; border-color: #bfe5d1; }

/* Authenticated dashboard diary — operational version of the landing preview */
.layout-app .dashboard-diary {
    color: var(--oem-body);
    background: #fff;
    border-color: #dce1ea;
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(20,24,36,.07), 0 2px 6px rgba(20,24,36,.04);
}
.layout-app .dashboard-diary .diary-header {
    min-height: 92px;
    padding: 1.2rem 1.35rem 1.05rem;
    background: linear-gradient(180deg,#fff 0%,#fbfcfe 100%);
}
.layout-app .dashboard-diary .diary-header h2 {
    margin-top: .15rem;
    color: #182239;
    font-size: 1.2rem;
    font-weight: 780;
    letter-spacing: -.02em;
}
.layout-app .dashboard-diary .diary-header-note { margin-top: .2rem; color: #626d83; font-size: .79rem; }
.layout-app .dashboard-diary .diary-header-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .65rem; }
.layout-app .dashboard-diary .diary-job-count {
    display: inline-flex;
    align-items: center;
    min-height: 31px;
    padding: .32rem .72rem;
    color: #fff;
    background: #1a2b4a;
    border-radius: 999px;
    font-size: .73rem;
    font-weight: 760;
    white-space: nowrap;
}
.layout-app .dashboard-diary .today-chip { min-height: 31px; color: #626d83; background: #fff; border-color: #dce1ea; }
.layout-app .dashboard-diary .today-chip i { color: #315fbf; }
.layout-app .dashboard-diary .diary-date-form { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; justify-content: flex-end; }
.layout-app .dashboard-diary .diary-date-control {
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    min-height: 34px;
    color: #626d83;
    background: #fff;
    border: 1px solid #dce1ea;
    border-radius: 7px;
}
.layout-app .dashboard-diary .diary-date-control > i { margin-left: .65rem; color: #315fbf; }
.layout-app .dashboard-diary .diary-date-input {
    width: 9.35rem;
    min-height: 32px;
    padding: .3rem .45rem;
    color: #263147;
    background: transparent;
    border: 0;
    font: inherit;
    font-size: .75rem;
    font-weight: 680;
}
.layout-app .dashboard-diary .diary-date-input:focus { outline: 0; box-shadow: inset 0 0 0 2px rgba(56,116,255,.32); }
.layout-app .dashboard-diary .diary-date-submit {
    align-self: stretch;
    padding: .3rem .65rem;
    color: #174494;
    background: #edf3ff;
    border: 0;
    border-left: 1px solid #d5e1fb;
    font-size: .7rem;
    font-weight: 750;
}
.layout-app .dashboard-diary .diary-date-submit:hover { background: #dfe9ff; }
.layout-app .dashboard-diary .diary-date-clear { color: #526078; font-size: .7rem; font-weight: 700; }
.layout-app .dashboard-diary .diary-filters {
    gap: .45rem;
    padding: .72rem 1.35rem;
    background: #fff;
    border-top-color: #e5e8ef;
    border-bottom-color: #e5e8ef;
    scrollbar-width: thin;
}
.layout-app .dashboard-diary .diary-filter {
    min-height: 34px;
    padding: .4rem .78rem;
    color: #525d73;
    border-color: #e1e5ec;
    background: #fff;
    font-size: .76rem;
}
.layout-app .dashboard-diary .diary-filter:hover,
.layout-app .dashboard-diary .diary-filter:focus-visible { color: #174494; background: #f3f6fc; border-color: #bacbf0; }
.layout-app .dashboard-diary .diary-filter.is-active {
    color: #fff;
    background: #244fae;
    border-color: #244fae;
    box-shadow: 0 3px 9px rgba(36,79,174,.18);
}
.layout-app .dashboard-diary .status-summary {
    gap: .5rem 1.4rem;
    padding: .65rem 1.35rem;
    background: #f8fafc;
    border-bottom-color: #e5e8ef;
}
.layout-app .dashboard-diary .status-summary-item { color: #626d83; font-size: .73rem; }
.layout-app .dashboard-diary .status-summary-item i { flex: none; }
.layout-app .dashboard-diary .status-summary-item strong { margin-left: .1rem; }
.layout-app .dashboard-diary-table { width: 100%; max-width: 100%; table-layout: fixed; --bs-table-bg: transparent; }
.layout-app .dashboard-diary-table thead th {
    padding: .72rem 1rem;
    color: #626d83;
    background: #fff;
    border-bottom: 1px solid #e5e8ef;
    font-size: .65rem;
}
.layout-app .dashboard-diary-table thead th:first-child { width: 36%; padding-left: 1.35rem; }
.layout-app .dashboard-diary-table thead th:nth-child(2) { width: 17%; }
.layout-app .dashboard-diary-table thead th:nth-child(3) { width: 19%; }
.layout-app .dashboard-diary-table thead th:nth-child(4) { width: 18%; }
.layout-app .dashboard-diary-table thead th:last-child { width: 64px; }
.layout-app .dashboard-diary-table tbody td {
    height: 82px;
    padding: .9rem 1rem;
    color: #313a4e;
    background: #fff;
    border-bottom-color: #e8ebf1;
}
.layout-app .dashboard-diary-table tbody td:first-child { padding-left: 1.35rem; }
.layout-app .dashboard-diary-table tbody tr:last-child td { border-bottom: 0; }
.layout-app .dashboard-diary-row { position: relative; }
.layout-app .dashboard-diary-row.is-overdue td:first-child { box-shadow: inset 3px 0 #d95b40; }
.layout-app .dashboard-diary-row:hover td { background: #f8faff; }
.layout-app .dashboard-diary-row:focus-within td { background: #f5f8ff; }
.layout-app .dashboard-diary-row:focus-within { outline: 3px solid rgba(56,116,255,.24); outline-offset: -3px; }
.layout-app .dashboard-diary .diary-job-main { min-width: 0; }
.layout-app .dashboard-diary .diary-job-title {
    display: block;
    overflow: hidden;
    color: #182239;
    font-size: .91rem;
    font-weight: 760;
    line-height: 1.35;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.layout-app .dashboard-diary .diary-job-title:hover { color: #174494; text-decoration: underline; text-underline-offset: 3px; }
.layout-app .dashboard-diary .diary-customer {
    display: flex;
    gap: .35rem;
    align-items: center;
    overflow: hidden;
    margin-top: .34rem;
    color: #626d83;
    font-size: .76rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.layout-app .dashboard-diary .diary-customer i { flex: none; color: #8994aa; }
.layout-app .dashboard-diary .reg-plate {
    padding: .22rem .58rem;
    color: #171717;
    background: #ffdd00;
    border-color: #c3a600;
    box-shadow: inset 0 -1px rgba(0,0,0,.08);
    font-size: .78rem;
    font-weight: 850;
    letter-spacing: .075em;
    white-space: nowrap;
}
.layout-app .dashboard-diary .diary-date { display: flex; gap: .42rem; align-items: center; color: #424c61; font-size: .79rem; font-weight: 650; }
.layout-app .dashboard-diary .diary-date i { color: #7b879e; }
.layout-app .dashboard-diary .overdue-flag {
    display: inline-flex;
    gap: .28rem;
    align-items: center;
    margin: .35rem 0 0;
    padding: .16rem .42rem;
    color: #9b2c17;
    background: #fff0ed;
    border: 1px solid #f4c5bc;
    border-radius: 999px;
    line-height: 1.2;
}
.layout-app .dashboard-diary .status-chip {
    min-height: 30px;
    padding: .34rem .62rem;
    color: #465069;
    background: #f0f2f6;
    border-color: #d5dae4;
    font-size: .71rem;
    font-weight: 750;
    white-space: nowrap;
}
.layout-app .dashboard-diary .status-chip.status-in_progress { color: #174494; background: #edf3ff; border-color: #c0d3ff; }
.layout-app .dashboard-diary .status-chip.status-awaiting_parts { color: #754006; background: #fff4e4; border-color: #e9c99e; }
.layout-app .dashboard-diary .status-chip.status-done,
.layout-app .dashboard-diary .status-chip.status-active { color: #146c43; background: #eaf7f0; border-color: #b7dfca; }
.layout-app .dashboard-diary .status-chip.status-invoiced { color: #075985; background: #eaf7fd; border-color: #b7ddec; }
.layout-app .dashboard-diary .status-chip i { flex: none; background: currentColor; }
.layout-app .dashboard-diary .diary-row-action { padding-right: 1rem; padding-left: .5rem; text-align: right; }
.layout-app .dashboard-diary .diary-row-action a {
    display: inline-grid;
    place-items: center;
    width: 32px;
    height: 32px;
    color: #63708a;
    border: 1px solid #dfe4ec;
    border-radius: 50%;
    text-decoration: none;
}
.layout-app .dashboard-diary .diary-row-action a:hover,
.layout-app .dashboard-diary .diary-row-action a:focus-visible { color: #174494; background: #edf3ff; border-color: #b9ccf4; }
.layout-app .dashboard-diary .diary-empty-state { max-width: 560px; padding: 4.5rem 1.5rem; }
.layout-app .dashboard-diary .diary-empty-state .empty-state-icon {
    color: #315fbf;
    background: #edf3ff;
    border: 1px solid #d5e1fb;
    box-shadow: 0 8px 24px rgba(36,79,174,.1);
}
.layout-app .dashboard-diary .diary-empty-state h2 { color: #182239; font-weight: 760; }
.table-app { --bs-table-hover-bg: #f7f9fd; }
.table-app thead th { padding: .62rem 1rem; font-size: .66rem; }
.table-app tbody td { padding: .78rem 1rem; vertical-align: middle; }
.table-app tbody tr { cursor: default; }
.table-app tbody tr[data-row-href] { cursor: pointer; }
.record-primary { color: var(--oem-ink); font-weight: 680; }
.empty-value { color: #929aab; font-size: .8rem; }
.count-pill { display: inline-grid; place-items: center; min-width: 26px; height: 26px; color: #394256; background: #f0f2f6; border-radius: 999px; font-size: .75rem; font-weight: 700; }
.list-toolbar { display: flex; justify-content: space-between; align-items: center; padding: .75rem 1rem; border-bottom: 1px solid var(--oem-line); }
.list-toolbar div { display: flex; gap: .55rem; align-items: baseline; }
.list-toolbar strong { color: var(--oem-ink); font-size: .82rem; }
.list-toolbar span { color: var(--oem-muted); font-size: .74rem; }
.row-actions { display: inline-flex; gap: .35rem; align-items: center; }
.row-actions form { margin: 0; }
.context-note { display: flex; gap: .75rem; padding: .8rem 1rem; color: #4c556b; background: #f7f8fa; border: 1px solid var(--oem-line); border-radius: var(--oem-radius); }
.context-note > i { color: #66718a; font-size: 1.05rem; }
.context-note div { display: flex; flex-direction: column; }
.context-note strong { color: var(--oem-ink); font-size: .82rem; }
.context-note span { font-size: .77rem; }
.context-note-success { background: #f0f8f4; border-color: #c9e6d6; }
.context-note-success > i { color: #198754; }
.reg-input { color: #171717; background: #fff9df; border-color: #d6b641; font-weight: 800; letter-spacing: .075em; text-transform: uppercase; }
.side-panel { padding: 1rem; }
.quick-action { padding: .68rem; border-radius: 8px; }
.quick-action-icon { font-size: 1rem; }
.job-form .form-content { padding: 1.2rem; }
.job-form .form-actions { margin: 0; }
.required-note { color: var(--oem-muted); font-size: .72rem; }
.schedule-panel { height: 100%; padding: 1rem; background: #f7f9fc; border: 1px solid var(--oem-line); border-radius: var(--oem-radius); }
.schedule-panel .section-kicker { display: block; margin-bottom: .8rem; }
.schedule-note { display: flex; gap: .55rem; margin-top: .8rem; color: var(--oem-muted); font-size: .76rem; }
.job-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin-top: .55rem; color: var(--oem-muted); font-size: .8rem; }
.job-meta > span:first-child { display: inline-flex; gap: .4rem; }
.job-progress { display: grid; grid-template-columns: repeat(4,1fr); margin-bottom: 1.25rem; padding: 1rem 1.2rem; }
.progress-step { position: relative; display: flex; gap: .55rem; align-items: center; color: #8a93a5; font-size: .76rem; }
.progress-step:not(:last-child)::after { content: ""; position: absolute; z-index: 0; left: 32px; right: 8px; top: 14px; height: 1px; background: #dce1e9; }
.progress-step > span { display: grid; z-index: 1; place-items: center; width: 28px; height: 28px; color: #727c90; background: #fff; border: 1px solid #ccd2dd; border-radius: 50%; font-size: .7rem; }
.progress-step.is-reached { color: var(--oem-ink); }
.progress-step.is-reached > span { color: #fff; background: #315fbf; border-color: #315fbf; }
.progress-step.is-reached:not(:last-child)::after { background: #8fb0f7; }
.detail-card .detail-content { padding: 1.2rem; }
.detail-field + .detail-field { margin-top: 1.4rem; padding-top: 1.2rem; border-top: 1px solid var(--oem-line); }
.detail-field > span, .context-card span:first-child { display: block; margin-bottom: .28rem; color: var(--oem-muted); font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.detail-field strong { color: var(--oem-ink); font-size: 1rem; }
.detail-field p { margin: 0; }
.context-card { display: flex; gap: .8rem; padding: 1rem; }
.context-card-icon { display: grid; place-items: center; width: 36px; height: 36px; flex: none; color: #315fbf; background: #edf3ff; border-radius: 8px; }
.context-card > div:last-child { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; }
.context-card a, .context-card small { margin-top: .2rem; }
.next-feature-panel { display: flex; gap: .8rem; padding: 1rem 1.2rem; color: #515b70; background: #fbfcfe; }
.next-feature-panel > i { color: var(--oem-warning); }
.next-feature-panel div { display: flex; flex-direction: column; }
.next-feature-panel strong { color: var(--oem-ink); font-size: .82rem; }
.next-feature-panel span { font-size: .77rem; }
.job-totals { width: min(100%, 360px); margin: 1rem 1.2rem 0 auto; padding: .8rem 1rem; background: #f8fafc; border: 1px solid var(--oem-line); border-radius: var(--oem-radius); }
.job-totals > div { display: flex; justify-content: space-between; gap: 1rem; padding: .28rem 0; color: var(--oem-muted); font-size: .8rem; }
.job-totals strong { color: var(--oem-ink); }
.job-totals-grand { margin-top: .35rem; padding-top: .65rem !important; border-top: 2px solid #cbd2df; font-size: .92rem !important; font-weight: 750; }
.job-line-form { margin: 0; padding: 1rem 1.2rem 1.2rem; background: #fbfcfe; border-top: 1px solid var(--oem-line); }
.info-card { padding: 1.15rem; }
.info-card h2 { margin: .3rem 0 .1rem; font-size: 1rem; }
.info-card p { color: var(--oem-muted); font-size: .82rem; }
.product-placeholder { max-width: 860px; margin: 0 auto; }
.product-placeholder h2 { margin-top: .35rem; font-size: 1.35rem; }
.product-placeholder > p { max-width: 35rem; margin: .5rem auto 1.25rem; color: var(--oem-muted); }
.placeholder-roadmap { display: flex; justify-content: center; align-items: center; gap: .65rem; margin-bottom: 1.5rem; color: var(--oem-muted); font-size: .78rem; }
.placeholder-roadmap span { padding: .45rem .65rem; background: #f6f8fb; border: 1px solid var(--oem-line); border-radius: 7px; }

/* Authenticated card composition and spacing */
.app-card > .app-card-body,
.admin-panel > .app-card-body {
    box-sizing: border-box;
    width: 100%;
    padding: var(--app-card-inset-block) var(--app-card-inset);
}
.app-card > .app-card-body > :last-child {
    margin-bottom: 0;
}

/*
 * Safety net: composite cards should use .app-card-body or a recognised
 * edge-to-edge section. If a future page adds a bare direct child, preserve
 * horizontal insets instead of letting content touch the card border.
 */
.app-shell .app-card:not(.side-panel):not(.info-card):not(.context-card):not(.form-panel):not(.job-form):not(.detail-card):not(.dashboard-diary):not(.job-progress):not(.placeholder-panel)
> :not(.app-card-body):not(.section-header):not(.card-header-clean):not(.list-toolbar):not(.table-responsive):not(.form-actions):not(.empty-state):not(.diary-filters):not(.status-summary):not(.diary-header):not(.diary-table-wrap):not(.job-cost-summary):not(.job-line-form):not(.job-lines-empty):not(.alert) {
    box-sizing: border-box;
    max-width: 100%;
    padding-right: var(--app-card-inset);
    padding-left: var(--app-card-inset);
}
.app-shell .app-card:not(.side-panel):not(.info-card):not(.context-card):not(.form-panel):not(.job-form):not(.detail-card):not(.dashboard-diary):not(.job-progress):not(.placeholder-panel)
> :first-child:not(.app-card-body):not(.section-header):not(.card-header-clean):not(.list-toolbar):not(.table-responsive):not(.empty-state) {
    padding-top: var(--app-card-inset-block);
}
.app-shell .app-card:not(.side-panel):not(.info-card):not(.context-card):not(.form-panel):not(.job-form):not(.detail-card):not(.dashboard-diary):not(.job-progress):not(.placeholder-panel)
> :last-child:not(.app-card-body):not(.table-responsive):not(.form-actions):not(.empty-state):not(.job-line-form) {
    padding-bottom: var(--app-card-inset-block);
}

.app-shell .section-header,
.app-shell .card-header-clean {
    padding: var(--app-card-inset-block) var(--app-card-inset);
}
.app-shell .app-card > .empty-state {
    padding-right: var(--app-card-inset);
    padding-left: var(--app-card-inset);
}
.app-shell .list-toolbar {
    min-height: 50px;
    padding: var(--app-card-inset-compact) var(--app-card-inset);
}
.app-shell .table-responsive {
    max-width: 100%;
}
.app-shell .dashboard-diary .diary-table-wrap {
    overflow-x: hidden;
}
.app-shell .table-app {
    margin-bottom: 0;
}
.app-shell .table-app thead th,
.app-shell .table-app tbody td {
    padding-right: 1rem;
    padding-left: 1rem;
}
.app-shell .table-app thead th:first-child,
.app-shell .table-app tbody td:first-child {
    padding-left: var(--app-card-inset);
}
.app-shell .table-app thead th:last-child,
.app-shell .table-app tbody td:last-child {
    padding-right: var(--app-card-inset);
}
.app-shell .table-app thead th {
    padding-top: .75rem;
    padding-bottom: .75rem;
}
.app-shell .table-app tbody td {
    padding-top: .875rem;
    padding-bottom: .875rem;
}
.admin-shell .table-responsive {
    max-width: 100%;
}
.admin-shell .table-app thead th:first-child,
.admin-shell .table-app tbody td:first-child {
    padding-left: var(--app-card-inset);
}
.admin-shell .table-app thead th:last-child,
.admin-shell .table-app tbody td:last-child {
    padding-right: var(--app-card-inset);
}
.app-shell .form-panel > form,
.app-shell .form-panel > .form-content,
.app-shell .job-form .form-content {
    padding: var(--app-card-inset-block) var(--app-card-inset);
}
.app-shell .form-panel > .alert {
    margin: var(--app-card-inset-block) var(--app-card-inset) 0;
}
.app-shell .form-actions {
    gap: .75rem;
    margin: var(--app-section-gap) calc(var(--app-card-inset) * -1) calc(var(--app-card-inset-block) * -1);
    padding: 1rem var(--app-card-inset);
}
.app-shell .form-panel > .form-actions {
    margin: 0;
}
.app-shell .job-form > .form-actions {
    margin: 0;
}
.app-shell .side-panel,
.app-shell .info-card,
.app-shell .context-card {
    padding: var(--app-card-inset-block) var(--app-card-inset);
}
.app-shell .side-panel > .section-header.compact {
    margin: calc(var(--app-card-inset-block) * -1) calc(var(--app-card-inset) * -1) var(--app-card-inset-compact);
    padding: var(--app-card-inset-block) var(--app-card-inset);
}
.app-shell .detail-card .detail-content {
    padding: var(--app-card-inset-block) var(--app-card-inset);
}
.app-shell .context-card {
    gap: 1rem;
}
.app-shell .placeholder-panel {
    padding-right: var(--app-card-inset);
    padding-left: var(--app-card-inset);
}
.app-shell .job-progress {
    padding-right: var(--app-card-inset);
    padding-left: var(--app-card-inset);
}
.app-shell .job-lines-empty {
    margin: 0;
    padding: var(--app-card-inset-block) var(--app-card-inset);
    border-bottom: 1px solid var(--oem-line);
}
.app-shell .job-cost-summary {
    padding: var(--app-card-inset-block) var(--app-card-inset);
}
.app-shell .job-totals {
    margin: 0 0 0 auto;
}
.app-shell .job-vat-note {
    width: min(100%, 360px);
    margin: .75rem 0 0 auto;
}
.app-shell .job-line-form {
    margin: 0;
    padding: var(--app-card-inset-block) var(--app-card-inset);
}
.app-shell .invoice-overview {
    display: grid;
    grid-template-columns: 1.25fr 1fr .8fr;
    gap: 1rem;
    border-bottom: 1px solid var(--oem-line);
    background: #fbfcfe;
}
.app-shell .invoice-overview-item {
    min-width: 0;
    padding-right: 1rem;
    border-right: 1px solid var(--oem-line);
}
.app-shell .invoice-overview-item:last-child {
    padding-right: 0;
    border-right: 0;
}
.app-shell .invoice-overview-item > span:first-child {
    display: block;
    margin-bottom: .35rem;
    color: var(--oem-muted);
    font-size: .68rem;
    font-weight: 750;
    letter-spacing: .075em;
    text-transform: uppercase;
}
.app-shell .invoice-overview-item strong,
.app-shell .invoice-overview-item small {
    display: block;
}
.app-shell .invoice-overview-item small {
    margin-top: .25rem;
    color: var(--oem-muted);
    line-height: 1.45;
}
.app-shell .invoice-overview-item .reg-plate {
    display: inline-block;
    margin-top: .55rem;
}

@media (max-width: 991.98px) {
    .app-shell {
        --app-card-inset: 1.125rem;
        --app-card-inset-block: 1.125rem;
        --app-section-gap: 1.125rem;
    }
}
@media (max-width: 767.98px) {
    .app-shell .invoice-overview {
        grid-template-columns: 1fr;
    }
    .app-shell .invoice-overview-item {
        padding-right: 0;
        padding-bottom: 1rem;
        border-right: 0;
        border-bottom: 1px solid var(--oem-line);
    }
    .app-shell .invoice-overview-item:last-child {
        padding-bottom: 0;
        border-bottom: 0;
    }
    .app-shell .job-progress {
        overflow: visible;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .875rem;
    }
    .app-shell .progress-step:not(:last-child)::after {
        display: none;
    }
}
@media (max-width: 575.98px) {
    .app-shell {
        --app-card-inset: 1rem;
        --app-card-inset-block: 1rem;
        --app-card-inset-compact: .75rem;
        --app-section-gap: 1rem;
    }
    .app-shell .table-responsive,
    .app-shell .dashboard-diary .diary-table-wrap {
        max-width: 100%;
        overflow-x: hidden;
    }
    .app-shell .table-app tbody tr {
        box-sizing: border-box;
        width: 100%;
        padding-right: var(--app-card-inset);
        padding-left: var(--app-card-inset);
    }
    .app-shell .table-app tbody td,
    .app-shell .table-app tbody td:first-child,
    .app-shell .table-app tbody td:last-child {
        min-width: 0;
        padding-right: 0;
        padding-left: 0;
        overflow-wrap: anywhere;
    }
}

/* Authentication */
.layout-auth { min-height: 100vh; background: #fff; }
.auth-wrap { display: grid; grid-template-columns: minmax(360px,42%) 1fr; min-height: 100vh; padding: 0; background: #fff; }
.auth-story { display: flex; flex-direction: column; justify-content: space-between; padding: clamp(2rem,5vw,4.5rem); color: #fff; background: radial-gradient(700px 500px at 20% 0,rgba(56,116,255,.3),transparent 65%),var(--oem-navy); }
.auth-story .brand-wordmark { align-self: flex-start; font-size: 1.35rem; }
.auth-story .brand-oem { color: #8fb0ff; }
.auth-story .brand-brain { color: #fff; }
.auth-story h1 { max-width: 600px; margin: .75rem 0 1rem; color: #fff; font-size: clamp(2rem,4vw,3.4rem); font-weight: 760; line-height: 1.08; letter-spacing: -.045em; }
.auth-story p { max-width: 540px; color: #b9c6df; font-size: 1rem; }
.auth-story > small { color: #8290ad; }
.auth-eyebrow { color: #8fb0ff; font-size: .7rem; font-weight: 780; letter-spacing: .1em; text-transform: uppercase; }
.auth-benefits { display: grid; gap: .65rem; margin: 1.5rem 0 0; padding: 0; list-style: none; }
.auth-benefits li { display: flex; gap: .55rem; align-items: center; color: #dce5f7; }
.auth-benefits i { color: #8fb0ff; }
.auth-workflow { display: flex; flex-wrap: wrap; gap: .55rem; align-items: center; margin-top: 1.5rem; }
.auth-workflow span { padding: .42rem .65rem; color: #fff; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: 6px; font-size: .76rem; font-weight: 700; }
.auth-workflow i { color: #7082a4; }
.auth-main { display: grid; place-items: center; padding: 2rem; }
.auth-card { max-width: 480px; padding: 0; border: 0; border-radius: 0; box-shadow: none; }
.auth-card-heading { margin-bottom: 1.5rem; }
.auth-card-heading h1 { margin: .3rem 0; font-size: 1.65rem; font-weight: 760; letter-spacing: -.03em; }
.auth-card-heading p { margin: 0; color: var(--oem-muted); }
.auth-mobile-brand { display: none; margin-bottom: 1.5rem; }
.auth-card .btn-primary { min-height: 44px; font-weight: 680; }

@media (max-width: 991.98px) {
    .app-sidebar { width: var(--bs-offcanvas-width); }
    .app-mobile-header { height: 58px; background: var(--oem-sidebar); }
    .app-mobile-header .brand-symbol { width: 27px; height: 27px; }
    .app-main { min-height: calc(100vh - 58px); }
    .auth-wrap { grid-template-columns: minmax(300px,38%) 1fr; }
    .auth-story { padding: 2rem; }
    .auth-story h1 { font-size: 2rem; }
    .metric-strip { grid-template-columns: repeat(2,1fr); }
    .stat-card:nth-child(2) { border-right: 0; }
    .stat-card:nth-child(-n+2) { border-bottom: 1px solid var(--oem-line); }
}
@media (max-width: 767.98px) {
    .auth-wrap { display: block; background: var(--oem-bg); }
    .auth-story { display: none; }
    .auth-main { min-height: 100vh; padding: 1.25rem; }
    .auth-card { padding: 1.5rem; background: #fff; border: 1px solid var(--oem-line); border-radius: var(--oem-radius-lg); box-shadow: var(--oem-shadow); }
    .auth-mobile-brand { display: inline-flex; }
    .job-progress { overflow-x: auto; grid-template-columns: repeat(4,minmax(120px,1fr)); }
}
@media (max-width: 575.98px) {
    .app-container { padding: 1rem .75rem 2rem; }
    .page-heading { align-items: stretch; margin-bottom: 1rem; }
    .page-heading > div:first-child { width: 100%; }
    .page-actions .btn { min-height: 42px; }
    .metric-strip { grid-template-columns: 1fr 1fr; }
    .stat-card { min-height: 74px; padding: .75rem; gap: .6rem; }
    .stat-icon { display: none; }
    .stat-arrow { display: none; }
    .stat-card .stat-value { font-size: 1.2rem; }
    .trial-banner .stat-icon { display: grid; }
    .trial-banner .btn { width: 100%; }
    .diary-header { align-items: flex-start; }
    .status-summary { display: grid; grid-template-columns: 1fr 1fr; }
    .table-responsive { overflow: visible; }
    .table-app thead { display: none; }
    .table-app, .table-app tbody { display: block; }
    .table-app tbody tr { display: grid; grid-template-columns: 1fr auto; padding: .8rem 1rem; border-bottom: 1px solid var(--oem-line); }
    .table-app tbody tr:last-child { border-bottom: 0; }
    .table-app tbody td { display: block; padding: .18rem 0; border: 0; text-align: right; }
    .table-app tbody td:first-child { grid-column: 1; text-align: left; }
    .table-app tbody td:last-child { grid-column: 2; grid-row: 1; }
    .table-app tbody td[data-label]::before { content: attr(data-label); float: left; margin-right: 1rem; color: var(--oem-muted); font-size: .68rem; font-weight: 650; text-transform: uppercase; }
    .table-app tbody td:first-child::before { display: none; }
    .layout-app .dashboard-diary .diary-header { gap: .9rem; min-height: 0; padding: 1rem; }
    .layout-app .dashboard-diary .diary-header-meta { width: 100%; justify-content: space-between; }
    .layout-app .dashboard-diary .diary-filters { padding: .65rem 1rem; scroll-padding-inline: 1rem; }
    .layout-app .dashboard-diary .status-summary { grid-template-columns: repeat(2,minmax(0,1fr)); padding: .65rem 1rem; }
    .layout-app .dashboard-diary .diary-table-wrap { padding: .65rem; background: #f5f7fa; }
    .layout-app .dashboard-diary-table tbody { display: grid; gap: .65rem; }
    .layout-app .dashboard-diary-table tbody tr {
        display: grid;
        grid-template-columns: minmax(0,1fr) auto;
        gap: .7rem 1rem;
        padding: 1rem;
        background: #fff;
        border: 1px solid #dfe4ec;
        border-radius: 12px;
        box-shadow: 0 2px 7px rgba(20,24,36,.04);
    }
    .layout-app .dashboard-diary-table tbody tr:last-child { border-bottom: 1px solid #dfe4ec; }
    .layout-app .dashboard-diary-table tbody td {
        display: block;
        height: auto;
        padding: 0;
        background: transparent;
        border: 0;
        text-align: left;
    }
    .layout-app .dashboard-diary-table tbody td:first-child { grid-column: 1 / -1; padding: 0; }
    .layout-app .dashboard-diary-table tbody td[data-label]::before { display: none; content: none; }
    .layout-app .dashboard-diary-table .diary-vehicle { grid-column: 1; grid-row: 2; align-self: center; }
    .layout-app .dashboard-diary-table .diary-due { grid-column: 1; grid-row: 3; }
    .layout-app .dashboard-diary-table .diary-status { grid-column: 2; grid-row: 2 / span 2; align-self: center; text-align: right; }
    .layout-app .dashboard-diary-table .diary-row-action { grid-column: 2; grid-row: 1; align-self: start; padding: 0; }
    .layout-app .dashboard-diary-row.is-overdue { border-color: #efc7bf; box-shadow: inset 3px 0 #d95b40, 0 2px 7px rgba(20,24,36,.04); }
    .layout-app .dashboard-diary-row.is-overdue td:first-child { box-shadow: none; }
    .layout-app .dashboard-diary-row:hover td,
    .layout-app .dashboard-diary-row:focus-within td { background: transparent; }
    .layout-app .dashboard-diary .diary-job-title { padding-right: 2.25rem; font-size: .94rem; white-space: normal; }
    .layout-app .dashboard-diary .diary-date { margin-top: .1rem; }
    .form-panel form, .form-panel > form, .job-form .form-content { padding: 1rem; }
    .form-actions { position: sticky; z-index: 5; bottom: 0; margin: 1rem -1rem -1rem; padding: .75rem 1rem; box-shadow: 0 -5px 14px rgba(20,24,36,.06); }
    .form-actions .btn { flex: 1; }
    .job-form .form-actions { margin: 0; }
    .placeholder-roadmap { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Public landing page — intentionally scoped away from the app shell */
.landing-page {
    --landing-navy: #0b1739;
    --landing-navy-2: #13264a;
    --landing-red: #d64123;
    --landing-cream: #fffaf2;
    overflow: hidden;
    color: #31374a;
    background: #fff;
}
.landing-page h1, .landing-page h2, .landing-page h3 { letter-spacing: -.035em; }
.landing-page h2 { margin: .6rem 0 1rem; font-size: clamp(2rem,4vw,3.25rem); font-weight: 780; line-height: 1.08; text-wrap: balance; }
.landing-page h3 { font-weight: 740; }
.landing-page p { line-height: 1.75; }
.landing-section { padding: clamp(4.5rem,9vw,7.5rem) 0; scroll-margin-top: 68px; }
.landing-heading { max-width: 720px; margin-bottom: 3.25rem; }
.landing-heading.text-center { margin-right: auto; margin-left: auto; }
.landing-heading > p, .landing-intro { color: #59637a; font-size: 1.08rem; }
.landing-eyebrow {
    display: inline-flex; gap: .45rem; align-items: center; color: #315fbf;
    font-size: .72rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase;
}
.landing-eyebrow-on-dark { color: #a9c3ff; }
.landing-text-link { display: inline-flex; gap: .5rem; align-items: center; font-weight: 720; text-decoration: none; }

/* Hero */
.landing-page .landing-hero {
    position: relative; overflow: hidden; padding: clamp(4.5rem,8vw,7rem) 0;
    color: #fff; background:
        radial-gradient(700px 420px at 91% 8%,rgba(214,65,35,.22),transparent 67%),
        radial-gradient(900px 500px at 4% -20%,rgba(56,116,255,.25),transparent 65%),
        linear-gradient(145deg,#09152f 0%,#14284c 61%,#0b1739 100%);
}
.landing-page .landing-hero::before {
    position: absolute; inset: 0; content: ""; pointer-events: none; opacity: .28;
    background-image: linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(to right,transparent,#000);
}
.landing-page .landing-hero .container { position: relative; z-index: 1; }
.landing-hero-copy { max-width: 650px; }
.landing-page .landing-hero h1 {
    max-width: 680px; margin-top: .7rem; color: #fff;
    font-size: clamp(2.6rem,5.1vw,4.55rem); font-weight: 820; line-height: 1.02;
}
.landing-page .landing-hero .lead { max-width: 600px; color: #d8e1f0; font-size: clamp(1.05rem,1.8vw,1.23rem); }
.landing-page .landing-hero .btn { min-height: 52px; border-radius: 9px; font-size: .95rem; font-weight: 750; }
.landing-page .landing-hero .btn-primary {
    --bs-btn-bg: var(--landing-red); --bs-btn-border-color: var(--landing-red);
    --bs-btn-hover-bg: #b9331b; --bs-btn-hover-border-color: #b9331b;
    box-shadow: 0 10px 28px rgba(214,65,35,.3);
}
.landing-page .landing-hero .btn-outline-light { --bs-btn-border-color: rgba(255,255,255,.5); }
.landing-hero-proof {
    display: flex; flex-wrap: wrap; gap: .75rem 1.35rem; margin: 1.5rem 0 0; padding: 0; list-style: none;
    color: #bdc9dc; font-size: .78rem; font-weight: 600;
}
.landing-hero-proof li { display: inline-flex; gap: .42rem; align-items: center; }
.landing-hero-proof i { color: #9ab8ff; }

/* Hero diary: standalone rules prevent inherited app-card regressions */
.landing-diary-shell { position: relative; width: 100%; max-width: 590px; margin-left: auto; padding: .65rem; }
.landing-diary-shell::before {
    position: absolute; z-index: -1; inset: -1rem; content: ""; transform: rotate(1.2deg);
    background: linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.025));
    border: 1px solid rgba(255,255,255,.12); border-radius: 26px;
}
.landing-page .landing-diary-card {
    display: block !important; overflow: hidden !important; width: 100% !important;
    color: #31374a !important; background-color: #fff !important;
    border: 1px solid #e2e7f0 !important; border-radius: 17px !important;
    box-shadow: 0 30px 70px rgba(1,8,25,.42),0 5px 14px rgba(1,8,25,.2) !important;
}
.landing-page .landing-diary-toolbar {
    display: flex !important; justify-content: space-between !important; align-items: center !important; gap: 1rem !important;
    min-height: 88px !important; padding: 1.2rem 1.35rem !important;
    color: #17223a !important; background-color: #f9fbfe !important; border-bottom: 1px solid #e2e7f0 !important;
}
.landing-diary-toolbar > div { display: flex; flex-direction: column; gap: .28rem; }
.landing-diary-toolbar strong { display: flex; gap: .45rem; align-items: center; color: #17223a !important; font-size: 1.04rem; }
.landing-diary-toolbar strong > i { color: var(--landing-red); }
.landing-diary-toolbar strong small { color: #788299; font-size: .7rem; font-weight: 600; }
.landing-diary-kicker { color: #677188 !important; font-size: .64rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.landing-diary-count { padding: .38rem .75rem; color: #fff !important; background: #17294a !important; border-radius: 999px; font-size: .7rem; font-weight: 750; }
.landing-page .landing-diary-list { display: block !important; padding: .15rem 1.35rem !important; background: #fff !important; }
.landing-page .landing-diary-row {
    display: grid !important; grid-template-columns: 45px minmax(0,1fr) auto !important;
    gap: .9rem !important; align-items: center !important; min-height: 82px !important;
    padding: .85rem 0 !important; color: #31374a !important; background: #fff !important;
    border-bottom: 1px solid #e8ebf1 !important;
}
.landing-page .landing-diary-row:last-child { border-bottom: 0 !important; }
.landing-diary-time { color: #7a8499 !important; font-size: .7rem; font-weight: 750; font-variant-numeric: tabular-nums; }
.landing-page .landing-diary-job { display: flex !important; min-width: 0; flex-direction: column !important; gap: .35rem !important; }
.landing-page .landing-diary-job strong { overflow: hidden; color: #17223a !important; font-size: .87rem; font-weight: 760; text-overflow: ellipsis; white-space: nowrap; }
.landing-diary-job > span { display: flex; flex-wrap: wrap; gap: .55rem; align-items: center; color: #677188 !important; font-size: .72rem; }
.landing-plate {
    display: inline-block; padding: .1rem .4rem; color: #151515 !important; background: #ffdd00 !important;
    border: 1px solid #c5a800; border-radius: 4px; font-size: .63rem; font-weight: 850; letter-spacing: .075em; line-height: 1.35;
}
.landing-diary-status {
    display: inline-flex !important; gap: .4rem; align-items: center; width: max-content; padding: .32rem .56rem;
    border: 1px solid; border-radius: 999px; font-size: .65rem; font-weight: 750; font-style: normal; white-space: nowrap;
}
.landing-diary-status i { width: 6px; height: 6px; background: currentColor; border-radius: 50%; }
.landing-page .status-progress { color: #174494 !important; background: #edf3ff !important; border-color: #c0d3ff !important; }
.landing-page .status-parts { color: #754006 !important; background: #fff4e4 !important; border-color: #e9c99e !important; }
.landing-page .status-booked { color: #465069 !important; background: #f0f2f6 !important; border-color: #d5dae4 !important; }
.landing-page .status-done { color: #146c43 !important; background: #eaf7f0 !important; border-color: #b7dfca !important; }
.landing-diary-footer {
    display: flex; flex-wrap: wrap; gap: .55rem 1rem; padding: .8rem 1.35rem;
    color: #6c768c; background: #f9fbfe; border-top: 1px solid #e2e7f0; font-size: .65rem; font-weight: 650;
}
.landing-diary-footer i { font-size: .43rem; vertical-align: middle; }

/* Trust strip and product explanation */
.landing-trust-strip { color: #fff; background: var(--landing-navy); border-top: 1px solid rgba(255,255,255,.09); }
.landing-trust-grid { display: grid; grid-template-columns: repeat(4,1fr); }
.landing-trust-grid > div { display: flex; gap: .8rem; align-items: center; min-height: 108px; padding: 1.25rem; border-right: 1px solid rgba(255,255,255,.1); }
.landing-trust-grid > div:last-child { border-right: 0; }
.landing-trust-grid i { color: #9ab8ff; font-size: 1.35rem; }
.landing-trust-grid span { display: flex; flex-direction: column; color: #9eabc2; font-size: .72rem; line-height: 1.5; }
.landing-trust-grid strong { color: #fff; font-size: .83rem; }
.landing-problem { background: #fff; }
.landing-replaces-panel {
    display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch;
    overflow: hidden; background: #fff; border: 1px solid #dfe4ed; border-radius: 18px;
    box-shadow: 0 20px 55px rgba(20,24,36,.09);
}
.landing-replaces-old, .landing-replaces-new { padding: clamp(1.5rem,4vw,2.5rem); }
.landing-replaces-old { background: #f5f6f8; }
.landing-panel-label { display: block; margin-bottom: 1.25rem; color: #727c91; font-size: .67rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.landing-replaces-old ul { display: grid; gap: .7rem; margin: 0; padding: 0; list-style: none; }
.landing-replaces-old li { display: flex; gap: .65rem; align-items: center; padding: .65rem; color: #687187; background: #fff; border: 1px solid #e2e5eb; border-radius: 8px; font-size: .8rem; }
.landing-replaces-old i { color: #8992a5; }
.landing-replaces-arrow { display: grid; z-index: 1; place-items: center; margin: auto -19px; width: 38px; height: 38px; color: #fff; background: var(--landing-red); border: 4px solid #fff; border-radius: 50%; }
.landing-replaces-new { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.landing-product-mark { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 1rem; color: #fff; background: #315fbf; border-radius: 11px; }
.landing-replaces-new h3 { font-size: 1.35rem; }
.landing-replaces-new p { color: #626c82; font-size: .85rem; }
.landing-available, .landing-upcoming {
    display: inline-flex; gap: .38rem; align-items: center; width: max-content; font-size: .68rem; font-weight: 780; letter-spacing: .015em;
}
.landing-available { color: #157347; }
.landing-upcoming { color: #9b570b; }

/* Process and feature stories */
.landing-how { background: #f5f7fa; border-top: 1px solid #e4e8ef; border-bottom: 1px solid #e4e8ef; }
.landing-steps { display: grid; grid-template-columns: repeat(4,1fr); margin: 0; padding: 0; list-style: none; counter-reset: none; }
.landing-steps > li { position: relative; min-width: 0; padding: 1.75rem; background: #fff; border: 1px solid #dfe4ed; }
.landing-steps > li:first-child { border-radius: 14px 0 0 14px; }
.landing-steps > li:last-child { border-radius: 0 14px 14px 0; }
.landing-steps > li + li { border-left: 0; }
.landing-step-number { position: absolute; top: 1rem; right: 1.2rem; color: #c2c8d4; font-size: .68rem; font-weight: 800; }
.landing-step-icon { display: grid; place-items: center; width: 43px; height: 43px; margin-bottom: 1.4rem; color: #315fbf; background: #edf3ff; border-radius: 10px; font-size: 1.1rem; }
.landing-steps h3 { min-height: 2.6em; font-size: 1.02rem; line-height: 1.3; }
.landing-steps p { min-height: 8.5em; color: #626c82; font-size: .8rem; line-height: 1.65; }
.landing-features { background: #fff; }
.landing-feature-story { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(2.5rem,7vw,7rem); align-items: center; padding: 3.75rem 0; border-top: 1px solid #e5e8ee; }
.landing-feature-story:first-of-type { border-top: 0; }
.landing-feature-reverse .landing-feature-copy { grid-column: 2; }
.landing-feature-reverse .landing-feature-visual { grid-column: 1; grid-row: 1; }
.landing-feature-copy h3 { margin: .7rem 0 1rem; font-size: clamp(1.75rem,3vw,2.5rem); line-height: 1.12; }
.landing-feature-copy p { color: #59637a; }
.landing-check-list { display: grid; gap: .65rem; margin: 1.4rem 0 0; padding: 0; list-style: none; color: #3e485e; font-size: .85rem; }
.landing-check-list li { display: flex; gap: .55rem; }
.landing-check-list i { color: #198754; font-size: 1rem; }
.landing-feature-visual { padding: clamp(1.5rem,4vw,2.4rem); background: #f7f9fc; border: 1px solid #dfe4ed; border-radius: 18px; box-shadow: 0 18px 45px rgba(20,24,36,.08); }
.landing-board-visual { display: grid; gap: .65rem; transform: rotate(1deg); }
.landing-mini-header { display: flex; justify-content: space-between; padding: 0 .35rem .7rem; color: #697389; border-bottom: 1px solid #dfe4ed; font-size: .7rem; }
.landing-board-visual > div:not(:first-child) { display: grid; grid-template-columns: auto 1fr auto; gap: .7rem; align-items: center; padding: .8rem; background: #fff; border: 1px solid #e1e5ec; border-radius: 9px; }
.landing-board-visual strong { overflow: hidden; color: #263147; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.landing-board-visual em { padding: .25rem .45rem; border: 1px solid; border-radius: 99px; font-size: .58rem; font-weight: 750; font-style: normal; white-space: nowrap; }
.landing-roadmap-note { display: flex; gap: .85rem; margin-top: 1.4rem; padding: 1rem; background: #fff8ec; border: 1px solid #ecd3ad; border-radius: 10px; }
.landing-roadmap-note > i { color: #a95a08; font-size: 1.15rem; }
.landing-roadmap-note p { margin: 0; color: #684a2c; font-size: .78rem; line-height: 1.6; }
.landing-record-visual { display: flex; flex-direction: column; align-items: flex-start; }
.landing-big-plate { padding: .38rem .75rem; color: #161616; background: #ffdd00; border: 2px solid #c6a900; border-radius: 6px; font-size: 1.15rem; font-weight: 850; letter-spacing: .1em; }
.landing-record-visual dl { width: 100%; margin: 1.5rem 0; }
.landing-record-visual dl > div { display: flex; justify-content: space-between; padding: .65rem 0; border-bottom: 1px solid #dfe4ed; font-size: .8rem; }
.landing-record-visual dt { color: #778196; font-weight: 600; }
.landing-record-visual dd { margin: 0; color: #202b42; font-weight: 720; }
.landing-api-chip, .landing-pdf-chip { display: inline-flex; gap: .45rem; align-items: center; padding: .45rem .65rem; border-radius: 7px; font-size: .67rem; font-weight: 750; }
.landing-api-chip { color: #784b13; background: #fff1dc; border: 1px solid #efd0a5; }
.landing-cost-visual { background: #172747; border-color: #283b5f; }
.landing-cost-line, .landing-cost-total { display: flex; justify-content: space-between; gap: 1rem; padding: .8rem 0; color: #c5d0e3; border-bottom: 1px solid rgba(255,255,255,.1); font-size: .82rem; }
.landing-cost-line strong { color: #fff; }
.landing-cost-total { margin-top: .4rem; color: #fff; border-bottom: 0; font-size: 1rem; font-weight: 750; }
.landing-cost-total strong { color: #ffdd00; }
.landing-pdf-chip { margin-top: 1rem; color: #dbe6fb; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); }
.landing-roadmap-grid { display: grid; grid-template-columns: .85fr 1.5fr; gap: 3rem; margin-top: 4rem; padding: clamp(2rem,5vw,3.5rem); background: var(--landing-cream); border: 1px solid #eee0cd; border-radius: 18px; }
.landing-roadmap-intro h3 { margin: .6rem 0 1rem; font-size: 1.65rem; }
.landing-roadmap-intro p { color: #696273; font-size: .85rem; }
.landing-roadmap-items { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.landing-roadmap-items > div { display: grid; grid-template-columns: auto 1fr; gap: .7rem; padding: 1rem; background: #fff; border: 1px solid #eadfce; border-radius: 10px; }
.landing-roadmap-items i { color: #315fbf; font-size: 1.1rem; }
.landing-roadmap-items span { display: flex; flex-direction: column; color: #6c6674; font-size: .72rem; line-height: 1.5; }
.landing-roadmap-items strong { color: #293349; font-size: .8rem; }
.landing-roadmap-items em { grid-column: 2; color: #a45b0e; font-size: .62rem; font-weight: 750; font-style: normal; text-transform: uppercase; }

/* Workshop fit, pricing, FAQ and closing CTA */
.landing-workshop-fit { color: #d9e2f2; background: linear-gradient(135deg,#09152f,#14284c); }
.landing-workshop-fit h2, .landing-workshop-fit h3 { color: #fff; }
.landing-workshop-fit p { color: #b8c5da; }
.landing-fit-list { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.landing-fit-list > div { display: flex; gap: .85rem; padding: 1.15rem; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 11px; }
.landing-fit-list i { color: #9ab8ff; font-size: 1.2rem; }
.landing-fit-list span { display: flex; flex-direction: column; color: #aebbd0; font-size: .75rem; line-height: 1.55; }
.landing-fit-list strong { color: #fff; font-size: .88rem; }
.landing-pricing { background: #f5f7fa; }
.landing-price-toggle { display: flex; width: fit-content; margin: 0 auto 2rem; padding: .25rem; border: 1px solid #d8deea; border-radius: 999px; background: #fff; box-shadow: 0 4px 14px rgba(20,24,36,.05); }
.landing-price-toggle button { padding: .65rem 1rem; border: 0; border-radius: 999px; color: #59657a; background: transparent; font-size: .8rem; font-weight: 750; }
.landing-price-toggle button span { margin-left: .25rem; color: #198754; font-size: .68rem; }
.landing-price-toggle button.is-active { color: #fff; background: #315fbf; }
.landing-price-toggle button.is-active span { color: #fff; }
.landing-price-card { height: 100%; padding: clamp(1.6rem,4vw,2.4rem); background: #fff; border: 1px solid #dce2ec; border-radius: 16px; box-shadow: 0 5px 20px rgba(20,24,36,.05); }
.landing-price-featured { border: 2px solid #315fbf; box-shadow: 0 18px 45px rgba(49,95,191,.13); }
.landing-price-topline { display: flex; justify-content: space-between; gap: 1rem; min-height: 28px; color: #737d91; font-size: .68rem; font-weight: 700; }
.landing-price-badge { color: #174494; }
.landing-price-card h3 { margin: .6rem 0; font-size: 1.35rem; }
.landing-price-amount { color: #17223a; font-size: clamp(2.4rem,5vw,3.35rem); font-weight: 820; letter-spacing: -.05em; }
.landing-price-amount span { color: #707a8e; font-size: .8rem; font-weight: 600; letter-spacing: 0; }
.landing-price-options { display: grid; gap: .75rem; margin-bottom: .75rem; }
.landing-price-options > div { padding-bottom: .75rem; border-bottom: 1px solid #eef0f4; }
.landing-price-options small { color: #198754; font-weight: 700; }
.pricing-enhanced .landing-price-options > div[hidden] { display: none; }
.landing-price-card > p { min-height: 3.5em; color: #626c82; font-size: .82rem; }
.landing-price-list { display: grid; gap: .72rem; margin: 1.5rem 0; padding: 1.25rem 0; list-style: none; border-top: 1px solid #e5e8ee; border-bottom: 1px solid #e5e8ee; font-size: .8rem; }
.landing-price-list li { display: flex; gap: .55rem; }
.landing-price-list i { color: #198754; }
.landing-price-list .is-planned { color: #76501f; }
.landing-price-list .is-planned i { color: #a76012; }
.landing-pricing-note { max-width: 900px; margin: 1.5rem auto 0; color: #676f80; font-size: .72rem; text-align: center; }
.landing-pricing-note i { margin-right: .35rem; color: #315fbf; }
.landing-faq { background: #fff; }
.landing-faq .col-lg-4 > p { color: #626c82; }
.landing-faq-groups { display: grid; gap: 2rem; }
.landing-faq-group > h3 { margin-bottom: .65rem; color: #17223a; font-size: 1rem; font-weight: 800; }
.landing-accordion { border-top: 1px solid #dfe4ed; }
.landing-accordion .accordion-item { border: 0; border-bottom: 1px solid #dfe4ed; }
.landing-accordion .accordion-button { padding: 1.25rem .25rem; color: #202b42; background: transparent; box-shadow: none; font-size: .92rem; font-weight: 720; }
.landing-accordion .accordion-button:not(.collapsed) { color: #244fae; }
.landing-accordion .accordion-button:focus-visible { outline-offset: -3px; }
.landing-accordion .accordion-body { padding: 0 2rem 1.25rem .25rem; color: #5f687b; font-size: .84rem; line-height: 1.75; }
.landing-final-cta { padding: clamp(3.5rem,7vw,5.5rem) 0; color: #fff; background: linear-gradient(110deg,#d64123,#a82f19); }
.landing-final-inner { display: flex; justify-content: space-between; gap: 3rem; align-items: center; }
.landing-final-cta h2 { margin: .5rem 0; color: #fff; font-size: clamp(2rem,4vw,3rem); }
.landing-final-cta p { max-width: 660px; margin: 0; color: #ffe3dc; }
.landing-final-actions { display: flex; flex: none; gap: .75rem; }
.landing-final-actions .btn { font-size: .85rem; font-weight: 750; white-space: nowrap; }

.layout-public .site-footer { margin-top: 0 !important; }

@media (max-width: 1199.98px) {
    .landing-page .landing-diary-row { grid-template-columns: 40px minmax(0,1fr) !important; }
    .landing-diary-status { grid-column: 2; }
    .landing-page .landing-diary-row { min-height: 92px !important; }
    .landing-steps p { min-height: 10em; }
    .landing-final-inner { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 991.98px) {
    .landing-page .landing-hero { text-align: left; }
    .landing-hero-copy { margin: 0 auto; text-align: center; }
    .landing-hero-actions, .landing-hero-proof { justify-content: center; }
    .landing-diary-shell { margin: 1rem auto 0; }
    .landing-trust-grid { grid-template-columns: 1fr 1fr; }
    .landing-trust-grid > div:nth-child(2) { border-right: 0; }
    .landing-trust-grid > div:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.1); }
    .landing-steps { grid-template-columns: 1fr 1fr; gap: .75rem; }
    .landing-steps > li, .landing-steps > li:first-child, .landing-steps > li:last-child { border: 1px solid #dfe4ed; border-radius: 12px; }
    .landing-steps p { min-height: 6.5em; }
    .landing-roadmap-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767.98px) {
    .landing-page h2 { font-size: clamp(1.85rem,9vw,2.6rem); }
    .landing-replaces-panel { grid-template-columns: 1fr; }
    .landing-replaces-arrow { margin: -19px auto; transform: rotate(90deg); }
    .landing-feature-story { grid-template-columns: 1fr; gap: 2rem; padding: 3rem 0; }
    .landing-feature-reverse .landing-feature-copy, .landing-feature-reverse .landing-feature-visual { grid-column: 1; grid-row: auto; }
    .landing-feature-reverse .landing-feature-visual { grid-row: 2; }
    .landing-roadmap-items { grid-template-columns: 1fr; }
    .landing-fit-list { grid-template-columns: 1fr; }
    .landing-final-actions { width: 100%; flex-wrap: wrap; }
}
@media (max-width: 575.98px) {
    .landing-section { padding: 4rem 0; }
    .landing-page .landing-hero { padding: 3.75rem 0 4.25rem; }
    .landing-page .landing-hero h1 { font-size: clamp(2.35rem,12vw,3.2rem); }
    .landing-hero-actions .btn { width: 100%; }
    .landing-hero-proof { display: grid; gap: .55rem; text-align: left; }
    .landing-diary-shell { padding: 0; }
    .landing-page .landing-diary-toolbar { padding: 1rem !important; }
    .landing-diary-toolbar strong small { display: none; }
    .landing-page .landing-diary-list { padding: .1rem 1rem !important; }
    .landing-page .landing-diary-row { grid-template-columns: 37px minmax(0,1fr) !important; gap: .55rem !important; min-height: 94px !important; }
    .landing-diary-status { padding: .25rem .42rem; font-size: .59rem; }
    .landing-diary-footer { padding: .7rem 1rem; }
    .landing-trust-grid { grid-template-columns: 1fr; }
    .landing-trust-grid > div { min-height: 90px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.1); }
    .landing-trust-grid > div:last-child { border-bottom: 0; }
    .landing-steps { grid-template-columns: 1fr; }
    .landing-steps h3, .landing-steps p { min-height: 0; }
    .landing-board-visual > div:not(:first-child) { grid-template-columns: auto 1fr; }
    .landing-board-visual em { grid-column: 2; }
    .landing-roadmap-grid { padding: 1.35rem; }
    .landing-final-actions .btn { width: 100%; }
}

/* Platform-admin control plane */
.layout-admin { overflow-x: hidden; background: #f2f4f8; }
.admin-shell { display: flex; min-height: 100vh; }
.admin-sidebar {
    --bs-offcanvas-width: 278px; width: 278px; flex: 0 0 278px;
    color: #fff; background: linear-gradient(180deg,#111b35,#091126); border: 0;
    box-shadow: 8px 0 30px rgba(7,14,32,.12);
}
.admin-sidebar-header { height: 74px; padding: 0 1.25rem; border-bottom: 1px solid rgba(255,255,255,.1); }
.admin-sidebar-header .brand-wordmark { font-size: 1.45rem; }
.admin-sidebar .brand-brain { color: #fff; }
.admin-context {
    display: flex; gap: .75rem; align-items: center; margin-bottom: 1.25rem; padding: .8rem;
    color: #fff; background: rgba(220,53,69,.13); border: 1px solid rgba(255,119,132,.25); border-radius: 11px;
}
.admin-context > i { color: #ff9aa5; font-size: 1.25rem; }
.admin-context span { display: flex; flex-direction: column; }
.admin-context small { color: #dba9b0; font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; }
.admin-context strong { font-size: .88rem; }
.admin-content { width: calc(100% - 278px); min-width: 0; }
.admin-main { min-height: 100vh; }
.admin-container { width: 100%; max-width: 1680px; margin: 0 auto; padding: 2rem clamp(1rem,2.5vw,2.5rem) 3rem; }
.admin-mobile-header {
    display: none; height: 62px; padding: 0 1rem; align-items: center; justify-content: space-between;
    color: #fff; background: #111b35; box-shadow: 0 2px 10px rgba(0,0,0,.12);
}
.admin-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; }
.admin-metric {
    display: flex; gap: .85rem; align-items: center; min-height: 94px; padding: 1rem 1.1rem;
    background: #fff; border: 1px solid var(--oem-line); border-radius: 12px; box-shadow: 0 1px 2px rgba(20,24,36,.04);
}
.admin-metric > i { display: grid; place-items: center; width: 40px; height: 40px; flex: none; color: #315fbf; background: #edf3ff; border-radius: 9px; }
.admin-metric div { display: flex; min-width: 0; flex-direction: column; }
.admin-metric strong { color: var(--oem-ink); font-size: 1.35rem; line-height: 1.15; }
.admin-metric span { color: var(--oem-muted); font-size: .75rem; }
.admin-panel { overflow: hidden; }
.admin-panel > .card-header-clean { padding: 1rem 1.25rem; }
.admin-panel > .card-header-clean h2 { margin: 0; font-size: 1rem; }
.admin-panel > form, .admin-panel > dl, .admin-panel > ul { margin: 0; padding: 1.25rem; }
.admin-truth-note {
    display: flex; gap: .65rem; align-items: flex-start; padding: .8rem .9rem;
    color: #604515; background: #fff8e8; border: 1px solid #ead6a6; border-radius: 9px; font-size: .78rem; line-height: 1.5;
}
.admin-truth-note i { margin-top: .1rem; color: #a56700; }
.subscription-health { display: grid; gap: .75rem; padding: 1.15rem 1.25rem; }
.subscription-health > div { display: flex; align-items: center; justify-content: space-between; }
.subscription-health > div > strong { color: var(--oem-ink); font-size: 1.15rem; }
.admin-panel > .admin-truth-note { margin: 0 1.25rem 1.25rem; }
.admin-activity { display: grid; gap: 0; padding: .4rem 1.25rem 1rem; }
.admin-activity > div { display: flex; gap: .7rem; padding: .75rem 0; border-bottom: 1px solid var(--oem-line); }
.admin-activity > div:last-child { border-bottom: 0; }
.admin-activity i { color: #315fbf; }
.admin-activity span { display: flex; min-width: 0; flex-direction: column; }
.admin-activity strong { overflow: hidden; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-activity small { color: var(--oem-muted); font-size: .7rem; }
.admin-filter {
    display: flex; gap: .9rem; align-items: end; padding: 1rem; box-shadow: none;
}
.admin-filter > div { min-width: 180px; flex: 1; }
.admin-filter label { margin-bottom: .35rem; color: var(--oem-muted); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.admin-filter .btn { min-width: 90px; }
.admin-details { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 2rem; }
.admin-details > div { min-width: 0; }
.admin-details .wide { grid-column: 1 / -1; }
.admin-details dt, .admin-mini-details dt { color: var(--oem-muted); font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; }
.admin-details dd, .admin-mini-details dd { margin: .15rem 0 0; color: var(--oem-ink); overflow-wrap: anywhere; }
.admin-mini-details { display: grid; gap: .25rem; font-size: .78rem; }
.admin-mini-details dd { margin-bottom: .65rem; }
.admin-sticky { position: sticky; top: 1rem; }
.admin-status-card {
    display: flex; height: 100%; min-height: 145px; padding: 1.1rem; flex-direction: column;
    background: #fff; border: 1px solid var(--oem-line); border-radius: 12px;
}
.admin-status-card > span { color: var(--oem-muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; }
.admin-status-card strong { margin: .5rem 0; font-size: 1rem; }
.admin-status-card small { color: var(--oem-muted); line-height: 1.5; }
.integration-card { display: flex; gap: 1rem; height: 100%; padding: 1.2rem; }
.integration-icon { font-size: 1.5rem; }
.integration-card h2 { margin: .15rem 0 .6rem; font-size: 1.05rem; }
.integration-card p { margin: .8rem 0 0; color: var(--oem-muted); font-size: .78rem; line-height: 1.55; }
.admin-safe-list { display: grid; gap: .65rem; color: var(--oem-muted); font-size: .82rem; }
.audit-metadata { display: grid; grid-template-columns: auto 1fr; gap: .2rem .5rem; margin: .5rem 0 0; font-size: .7rem; }
.audit-metadata dt { color: var(--oem-muted); }
.audit-metadata dd { margin: 0; overflow-wrap: anywhere; }
.status-chip.status-trial { color: #734e00; background: #fff5d6; border-color: #e6cc79; }
.status-chip.status-past_due { color: #864300; background: #fff0df; border-color: #edc18f; }
.status-chip.status-unpaid { color: #7a2831; background: #fdecef; border-color: #efbdc4; }
.status-chip.status-cancelled { color: #7a2831; background: #fdecef; border-color: #efbdc4; }
.language-selector { min-width: 155px; }
.language-selector .form-select { font-size: .75rem; }
.navbar-public .language-selector .form-select { color: #fff; background-color: rgba(255,255,255,.1); border-color: rgba(255,255,255,.35); }
.navbar-public .language-selector option { color: #141824; background: #fff; }
.sidebar-footer .language-selector { width: 100%; margin-bottom: .75rem; }
.sidebar-footer .language-selector .form-select { color: #fff; background-color: rgba(255,255,255,.08); border-color: rgba(255,255,255,.2); }
.sidebar-footer .language-selector option { color: #141824; background: #fff; }

@media (max-width: 1199.98px) {
    .admin-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 991.98px) {
    .admin-sidebar { width: var(--bs-offcanvas-width); flex: none; }
    .admin-content { width: 100%; }
    .admin-mobile-header { display: flex; }
    .admin-container { padding-top: 1.25rem; }
    .admin-sticky { position: static; }
}
@media (max-width: 767.98px) {
    .admin-filter { align-items: stretch; flex-direction: column; }
    .admin-filter > div, .admin-filter .btn { width: 100%; }
    .admin-details { grid-template-columns: 1fr; }
    .admin-details .wide { grid-column: auto; }
}
@media (max-width: 575.98px) {
    .admin-metrics { grid-template-columns: 1fr; }
    .admin-metric { min-height: 80px; }
}
