:root {
    --ink: #182123;
    --muted: #627073;
    --line: #dbe3df;
    --paper: #fbfcfa;
    --white: #ffffff;
    --teal: #0f766e;
    --teal-dark: #0b4f4a;
    --green: #2f7d4d;
    --gold: #b8871b;
    --blue: #2d5b87;
    --coral: #bb5a4b;
    --panel: #f3f7f4;
    --shadow: 0 18px 50px rgba(24, 33, 35, .10);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    display: block;
    max-width: 100%;
}

button,
input,
select,
textarea {
    font: inherit;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 30;
    background: rgba(251, 252, 250, .93);
    border-bottom: 1px solid rgba(219, 227, 223, .85);
    backdrop-filter: blur(18px);
}

.nav-shell,
.section-inner,
.hero-inner {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
}

.section-inner.narrow {
    width: min(860px, calc(100% - 40px));
}

.center {
    text-align: center;
}

.nav-shell {
    min-height: 74px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.brand {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
}

.brand img {
    width: 142px;
    height: auto;
    mix-blend-mode: multiply;
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 22px;
    color: #334143;
    font-size: 14px;
    font-weight: 600;
}

.nav-links a {
    padding: 26px 0;
    border-bottom: 2px solid transparent;
}

.nav-links a.active,
.nav-links a:hover {
    color: var(--teal-dark);
    border-bottom-color: var(--teal);
}

.nav-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.mobile-menu {
    display: none;
    position: relative;
}

.mobile-menu summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--white);
    color: var(--ink);
    font-size: 14px;
    font-weight: 800;
    list-style: none;
    cursor: pointer;
}

.mobile-menu summary::-webkit-details-marker {
    display: none;
}

.mobile-menu-panel {
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    width: min(310px, calc(100vw - 28px));
    display: grid;
    gap: 4px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--white);
    box-shadow: var(--shadow);
}

.mobile-menu-panel a {
    padding: 12px;
    border-radius: 8px;
    color: #334143;
    font-weight: 800;
}

.mobile-menu-panel a.active,
.mobile-menu-panel a:hover {
    background: var(--panel);
    color: var(--teal-dark);
}

.mobile-menu-panel .mobile-primary {
    background: var(--teal-dark);
    color: var(--white);
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 18px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    white-space: nowrap;
}

.button.primary {
    background: var(--teal-dark);
    color: var(--white);
}

.button.secondary {
    background: var(--white);
    color: var(--ink);
    border-color: var(--line);
}

.button.ghost {
    color: var(--teal-dark);
}

.button:disabled {
    cursor: not-allowed;
    opacity: .62;
}

.hero {
    min-height: 560px;
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #182123;
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(16, 27, 29, .94), rgba(16, 27, 29, .68) 48%, rgba(16, 27, 29, .28)),
        url("/assets/about-team.png") center / cover no-repeat;
}

.hero-inner {
    position: relative;
    padding: 58px 0 70px;
    color: var(--white);
}

.eyebrow {
    color: #9bd5ce;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
}

h1,
h2,
h3,
p {
    margin: 0;
}

h1 {
    width: min(820px, 100%);
    margin-top: 18px;
    font-size: clamp(44px, 6vw, 72px);
    line-height: .98;
    letter-spacing: 0;
}

.hero-copy {
    width: min(650px, 100%);
    margin-top: 26px;
    color: #e2ece8;
    font-size: 20px;
    line-height: 1.55;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 34px;
}

.hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 46px;
}

.pill {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .24);
    color: #edf7f2;
    font-size: 13px;
    font-weight: 700;
}

.section {
    padding: 86px 0;
}

.section.alt {
    background: #eef4f0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 34px;
}

.section-title {
    width: min(740px, 100%);
}

.section-title h2 {
    margin-top: 10px;
    font-size: clamp(32px, 4vw, 54px);
    line-height: 1.04;
}

.section-title p {
    margin-top: 16px;
    color: var(--muted);
    font-size: 18px;
    line-height: 1.65;
}

.free-cta {
    display: grid;
    gap: 10px;
    justify-items: end;
}

.free-cta span,
.mini-label {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 11px;
    border-radius: 999px;
    background: #dcefe9;
    color: var(--teal-dark);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.free-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: -10px 0 26px;
    padding: 16px 18px;
    border: 1px solid #bcdcd3;
    border-radius: 8px;
    background: #e9f7f2;
}

.free-strip strong {
    color: var(--teal-dark);
    font-size: 18px;
}

.free-strip span {
    color: #415457;
    line-height: 1.5;
}

.grid {
    display: grid;
    gap: 18px;
}

.grid.three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.split {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
    gap: 28px;
    align-items: start;
}

.card,
.panel,
.metric,
.form-panel {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 8px;
}

.card {
    padding: 26px;
}

.card h3 {
    font-size: 21px;
    line-height: 1.2;
}

.card p,
.card li {
    color: var(--muted);
    line-height: 1.62;
}

.card p {
    margin-top: 12px;
}

.card ul {
    display: grid;
    gap: 10px;
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

.tag-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.tag {
    padding: 6px 9px;
    border-radius: 999px;
    background: var(--panel);
    color: #34484a;
    font-size: 12px;
    font-weight: 800;
}

.regulatory-grid {
    display: grid;
    gap: 18px;
    margin-top: 34px;
}

.reg-card {
    padding: 28px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--white);
}

.reg-card-head {
    display: flex;
    align-items: center;
    gap: 14px;
}

.reg-card-head span,
.learn-step span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #dcefe9;
    color: var(--teal-dark);
    font-size: 13px;
    font-weight: 900;
}

.reg-card-head .flag-icon {
    width: 46px;
    height: 46px;
    border: 1px solid #c8d8d4;
    background: #f8fbf9;
    color: inherit;
    font-size: 26px;
    font-weight: 400;
    line-height: 1;
}

.reg-card h3,
.learning-band h3,
.learn-step h3,
.resource-card h3 {
    font-size: 24px;
    line-height: 1.15;
}

.reg-card > p,
.learning-band p,
.learn-step p {
    margin-top: 14px;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.62;
}

.reg-columns {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 24px;
    margin-top: 22px;
}

.reg-columns h4 {
    margin: 0 0 10px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #3f5053;
}

.reg-columns ul,
.learn-step ul {
    display: grid;
    gap: 9px;
    margin: 0;
    padding-left: 18px;
    color: var(--muted);
    line-height: 1.58;
}

.reg-columns p {
    margin: 0;
    color: var(--muted);
    line-height: 1.62;
}

.source-links,
.resource-list {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 22px;
}

.source-links a,
.resource-list a {
    padding: 9px 11px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--panel);
    color: var(--teal-dark);
    font-size: 13px;
    font-weight: 800;
}

.learning-band {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 26px;
    margin-top: 34px;
    padding: 28px;
    border: 1px solid #bcdcd3;
    border-radius: 8px;
    background: #e9f7f2;
}

.learning-band h3 {
    margin-top: 12px;
}

.learning-roadmap {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 22px;
}

.learn-step {
    padding: 26px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--white);
}

.learn-step h3 {
    margin-top: 16px;
}

.learn-step ul {
    margin-top: 16px;
}

.resource-card {
    margin-top: 22px;
}

.workflow {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.step {
    min-height: 154px;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--white);
}

.step span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #dcefe9;
    color: var(--teal-dark);
    font-weight: 800;
}

.step h3 {
    margin-top: 16px;
    font-size: 18px;
}

.step p {
    margin-top: 8px;
    color: var(--muted);
    line-height: 1.55;
}

.tool-preview {
    display: grid;
    grid-template-columns: .95fr 1.05fr;
    gap: 26px;
    align-items: stretch;
}

.mock-window {
    border-radius: 8px;
    border: 1px solid #cad7d3;
    background: var(--white);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.mock-bar {
    display: flex;
    gap: 6px;
    align-items: center;
    height: 42px;
    padding: 0 14px;
    background: #edf3ef;
    border-bottom: 1px solid var(--line);
}

.dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--coral);
}

.dot:nth-child(2) {
    background: var(--gold);
}

.dot:nth-child(3) {
    background: var(--green);
}

.mock-body {
    padding: 22px;
}

.risk-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 14px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid var(--line);
}

.risk-row:last-child {
    border-bottom: 0;
}

.risk-row strong {
    font-size: 15px;
}

.risk-row small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
}

.status {
    padding: 6px 9px;
    border-radius: 999px;
    background: #e6f1ec;
    color: var(--green);
    font-size: 12px;
    font-weight: 800;
}

.status.warn {
    background: #f5ecd6;
    color: #8b6515;
}

.status.hot {
    background: #f4ded9;
    color: #a24334;
}

.status.done {
    background: #dcefe9;
    color: var(--green);
}

.status.progress {
    background: #dce9f3;
    color: var(--blue);
}

.priority {
    display: inline-flex;
    padding: 6px 9px;
    border-radius: 999px;
    background: #e8eef0;
    color: #415457;
    font-size: 12px;
    font-weight: 800;
}

.priority.high {
    background: #f4ded9;
    color: #a24334;
}

.priority.low {
    background: #e7f0e8;
    color: var(--green);
}

.guide {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}

.guide-step {
    min-height: 144px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--white);
}

.guide-step strong {
    display: block;
    margin-top: 12px;
}

.guide-step p {
    margin-top: 8px;
    color: var(--muted);
    line-height: 1.5;
}

.guide-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #dcefe9;
    color: var(--teal-dark);
    font-weight: 800;
}

.task-list {
    display: grid;
    gap: 14px;
}

.task-item {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--white);
}

.task-item h3 {
    font-size: 18px;
}

.task-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-top: 10px;
}

.inline-actions form {
    margin: 0;
}

.edit-panel {
    margin-top: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #f8faf8;
}

.edit-panel summary {
    cursor: pointer;
    color: var(--teal-dark);
    font-weight: 800;
}

.alert-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 22px;
}

.alert-card {
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--white);
}

.alert-card strong {
    display: block;
    margin-top: 6px;
    font-size: 28px;
}

.alert-card.hot strong {
    color: var(--coral);
}

.alert-card.warn strong {
    color: var(--gold);
}

.print-only {
    display: none;
}

.detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 20px;
}

.price {
    font-size: 32px;
    font-weight: 800;
}

.price small {
    display: block;
    margin-top: 6px;
    color: var(--muted);
    font-size: 14px;
    font-weight: 600;
}

.profile {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 34px;
    align-items: start;
}

.profile-image {
    aspect-ratio: 4 / 5;
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(15, 118, 110, .12), rgba(184, 135, 27, .12)),
        #e8f0ed;
    border: 1px solid var(--line);
    display: grid;
    place-items: center;
    color: var(--teal-dark);
    font-size: 56px;
    font-weight: 800;
}

.source-note {
    margin-top: 20px;
    padding: 16px 18px;
    border-left: 4px solid var(--teal);
    background: #eef7f4;
    color: #355052;
    line-height: 1.55;
}

.section-kicker,
.form-hint {
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.form-hint {
    margin-top: 8px;
    line-height: 1.55;
    text-transform: none;
    letter-spacing: 0;
}

.template-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.template-card {
    display: grid;
    gap: 10px;
    align-content: start;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fbfdfc;
}

.template-card h4 {
    color: var(--ink);
    font-size: 16px;
    line-height: 1.25;
}

.template-card p,
.template-card small {
    color: var(--muted);
    line-height: 1.45;
}

.template-card form {
    margin-top: 4px;
}

.evidence-bridge {
    border-bottom: 1px solid var(--line);
}

.evidence-flow {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
    gap: 10px;
    align-items: center;
    min-width: 420px;
}

.evidence-flow div {
    min-height: 74px;
    display: grid;
    place-items: center;
    padding: 14px;
    border: 1px solid #bcdcd3;
    border-radius: 8px;
    background: #e9f7f2;
    color: var(--teal-dark);
    font-weight: 900;
    text-align: center;
}

.evidence-flow span {
    color: var(--gold);
    font-weight: 900;
}

.report-outline {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.report-outline div {
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fbfdfc;
}

.report-outline strong,
.report-outline span {
    display: block;
}

.report-outline span {
    margin-top: 6px;
    color: var(--muted);
    line-height: 1.5;
}

.dashboard-guide {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    margin-bottom: 22px;
    padding: 22px;
    border: 1px solid #bcdcd3;
    border-radius: 8px;
    background: #e9f7f2;
}

.sample-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: start;
}

.sample-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.language-actions {
    max-width: 420px;
}

.language-actions form {
    margin: 0;
}

.dashboard-guide[hidden] {
    display: none;
}

.dashboard-guide h2 {
    margin-top: 6px;
    color: var(--ink);
    font-size: 26px;
}

.dashboard-guide p {
    margin-top: 8px;
    color: #355052;
    line-height: 1.6;
}

.guide-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.quiet-focus-list {
    padding-top: 38px;
}

.quiet-focus-list h3 {
    font-size: 21px;
}

.quiet-focus-list ul {
    display: grid;
    gap: 10px;
    margin-top: 14px;
    padding: 0;
    list-style: none;
}

.quiet-focus-list li {
    color: #355052;
    line-height: 1.5;
}

.subtle-link-line {
    margin-top: 14px !important;
    font-size: 15px !important;
}

.subtle-link-line a {
    color: var(--teal-dark);
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.legal-page h1 {
    color: var(--ink);
    font-size: clamp(40px, 6vw, 64px);
    line-height: 1.05;
}

.legal-page h2 {
    margin-top: 34px;
    color: var(--ink);
    font-size: 24px;
}

.legal-page p {
    margin-top: 14px;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.7;
}

.legal-updated {
    color: var(--teal-dark) !important;
    font-weight: 800;
}

.cookie-banner {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 60;
    width: min(620px, calc(100% - 44px));
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    align-items: center;
    padding: 18px;
    border: 1px solid #bcdcd3;
    border-radius: 8px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 18px 44px rgba(24, 33, 35, .16);
}

.cookie-banner[hidden] {
    display: none;
}

.cookie-banner strong {
    color: var(--ink);
}

.cookie-banner p {
    margin-top: 6px;
    color: var(--muted);
    line-height: 1.5;
}

.cookie-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.cookie-actions a {
    color: var(--teal-dark);
    font-weight: 800;
    font-size: 13px;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.field {
    display: grid;
    gap: 7px;
}

.field.full {
    grid-column: 1 / -1;
}

.honeypot-field {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.field label {
    font-size: 13px;
    font-weight: 800;
    color: #334143;
}

.field input,
.field select,
.field textarea {
    width: 100%;
    border: 1px solid #cdd9d5;
    border-radius: 8px;
    background: var(--white);
    padding: 12px 13px;
    color: var(--ink);
}

.field textarea {
    min-height: 142px;
    resize: vertical;
}

.auth-page {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.auth-art {
    display: flex;
    align-items: flex-end;
    padding: 52px;
    color: var(--white);
    background:
        linear-gradient(180deg, rgba(15, 79, 74, .35), rgba(19, 32, 34, .92)),
        url("/assets/about-europe-office.png") center / cover no-repeat;
}

.auth-art h1 {
    font-size: clamp(36px, 5vw, 64px);
}

.auth-panel {
    display: grid;
    place-items: center;
    padding: 40px;
}

.auth-box {
    width: min(430px, 100%);
}

.auth-box .brand {
    margin-bottom: 38px;
}

.google-button {
    width: 100%;
    margin: 18px 0;
    background: var(--white);
    border: 1px solid var(--line);
}

.divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 18px 0;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

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

.shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 260px 1fr;
    background: #f4f7f5;
    min-width: 0;
}

.sidebar {
    padding: 24px;
    background: #172326;
    color: #dfe9e6;
    min-width: 0;
}

.workspace-email-row {
    margin-bottom: 28px;
    min-width: 0;
}

.workspace-account-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 24px;
}

.workspace-account-actions form {
    margin: 0;
    flex: 0 0 auto;
}

.workspace-email {
    min-width: 0;
    overflow: hidden;
    color: var(--white);
    font-size: 14px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workspace-site-link {
    color: #9bd5ce;
    font-size: 12px;
    font-weight: 800;
}

.workspace-site-link:hover {
    color: var(--white);
}

.workspace-signout {
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    background: rgba(255, 255, 255, .08);
    color: #dfe9e6;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
    white-space: nowrap;
}

.workspace-signout:hover {
    background: rgba(255, 255, 255, .14);
    color: var(--white);
}

.side-nav {
    display: grid;
    gap: 8px;
}

.side-nav a {
    padding: 12px 13px;
    border-radius: 8px;
    color: #cbd8d5;
    font-weight: 700;
}

.side-nav a.active,
.side-nav a:hover {
    background: rgba(255, 255, 255, .10);
    color: var(--white);
}

.workspace {
    padding: 34px;
    min-width: 0;
}

.workspace-head {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

.workspace-head h1 {
    color: var(--ink);
    font-size: 36px;
    line-height: 1.1;
}

.metric {
    padding: 22px;
}

.metric span {
    color: var(--muted);
    font-weight: 700;
}

.metric strong {
    display: block;
    margin-top: 8px;
    font-size: 30px;
}

.table {
    width: 100%;
    border-collapse: collapse;
}

.table th,
.table td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: top;
}

.table th {
    color: #3f5053;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.footer {
    padding: 42px 0;
    background: #152123;
    color: #d6e2df;
}

.footer .section-inner {
    display: flex;
    justify-content: space-between;
    gap: 24px;
}

.footer a {
    color: #9bd5ce;
}

@media (max-width: 960px) {
    .nav-links,
    .nav-actions {
        display: none;
    }

    .mobile-menu {
        display: block;
    }

    .hero {
        min-height: auto;
    }

    .grid.three,
    .grid.two,
    .split,
    .workflow,
    .tool-preview,
    .profile,
    .auth-page,
    .shell,
    .guide,
    .detail-grid,
    .alert-grid,
    .template-grid,
    .report-outline {
        grid-template-columns: 1fr;
    }

    .dashboard-guide,
    .sample-card {
        grid-template-columns: 1fr;
    }

    .evidence-flow {
        grid-template-columns: 1fr;
        min-width: 0;
    }

    .evidence-flow span {
        display: none;
    }

    .guide-actions,
    .sample-actions {
        justify-content: flex-start;
    }

    .cookie-banner {
        grid-template-columns: 1fr;
    }

    .cookie-actions {
        justify-content: flex-start;
    }

    .reg-columns,
    .learning-roadmap {
        grid-template-columns: 1fr;
    }

    .learning-band,
    .free-strip {
        display: grid;
        justify-items: start;
    }

    .free-cta {
        justify-items: start;
    }

    .auth-art {
        min-height: 380px;
    }

    .sidebar {
        position: static;
        padding: 16px;
    }

    .workspace-email-row {
        margin-bottom: 0;
    }

    .side-nav {
        display: flex;
        gap: 8px;
        margin-top: 16px;
        overflow-x: auto;
        padding-bottom: 8px;
        scrollbar-width: thin;
        min-width: 0;
        max-width: 100%;
    }

    .side-nav a {
        flex: 0 0 auto;
        padding: 9px 11px;
        font-size: 13px;
    }

    .workspace-account-actions {
        margin-top: 12px;
        padding-top: 12px;
        border-top: 1px solid rgba(255, 255, 255, .10);
    }

    .workspace-email {
        max-width: 100%;
    }
}

/* Workplace AI service pages. Keep workspace and toolkit styles independent. */
.resource-menu { position: relative; }
.resource-menu summary { cursor: pointer; }
.resource-menu summary.active { color: var(--teal); }
.resource-menu-panel { position: absolute; top: 34px; left: -18px; width: 238px; display: grid; gap: 4px; padding: 12px; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow); }
.resource-menu-panel a { padding: 10px; border-radius: 4px; }
.resource-menu-panel a:hover { background: var(--panel); }
.ai-hero { background: #102f30; color: #fff; overflow: hidden; position: relative; }
.ai-hero::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 86% 30%, rgba(81, 147, 116, .2), transparent 55%); }
.ai-hero-grid { position: relative; display: grid; grid-template-columns: 1.12fr 1fr; gap: 66px; align-items: center; padding-top: 80px; padding-bottom: 72px; }
.ai-hero h1 { font-size: clamp(56px, 5.7vw, 80px); line-height: 1.04; letter-spacing: -.045em; margin-top: 24px; }
.ai-hero h1 em { color: #b5dca8; font-style: normal; }
.ai-hero-copy { max-width: 515px; margin-top: 26px; font-size: 19px; line-height: 1.65; color: #d0dfdb; }
.ai-hero .hero-actions { gap: 24px; align-items: center; }
.ai-hero .button, .ai-final-cta .button { gap: 10px; }
.ai-hero .button.primary { background: #c8e5b9; color: #14312a; border-color: #c8e5b9; }
.ai-hero .button.primary:hover { background: #e0f0d7; }
.ai-hero-note { margin-top: 32px; color: #a6bfba; font-size: 12px; line-height: 1.7; }
.ai-text-link { display: inline-flex; align-items: center; gap: 12px; color: var(--teal-dark); font-size: 14px; font-weight: 750; text-decoration: underline; text-underline-offset: 5px; line-height: 1.6; }
.ai-text-link:hover { color: var(--teal); }
.ai-hero .ai-text-link { color: #dcebdc; }
.ai-boundary { border: 1px solid #45605a; padding: 24px; border-radius: 12px; background: rgba(10, 30, 31, .42); }
.ai-boundary-heading { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; font-size: 10px; letter-spacing: .08em; color: #c5d4ce; }
.ai-example-label { font-size: 10px; padding: 5px 7px; border: 1px solid #546a62; border-radius: 4px; letter-spacing: 0; }
.ai-channels, .ai-outcomes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ai-channels { margin-top: 23px; }
.ai-channels span, .ai-outcomes span { font-size: 11px; line-height: 1.5; text-align: center; padding: 13px 5px; border: 1px solid #45605a; border-radius: 5px; color: #dae4de; }
.ai-connector { text-align: center; color: #a2c5ae; line-height: 35px; font-size: 20px; }
.ai-policy-box { background: #f3f5ec; padding: 22px; border-radius: 6px; color: #163d36; border-top: 3px solid #bbd7a0; }
.ai-policy-brand { display: flex; align-items: center; gap: 12px; font-size: 26px; font-weight: 900; }
.ai-policy-brand span { font-size: 9px; font-weight: 750; letter-spacing: .06em; }
.ai-policy-box h2 { font-size: 24px; line-height: 1.25; margin: 15px 0 20px; letter-spacing: -.03em; }
.ai-rule-row { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 11px 0; border-top: 1px solid #d9e0d3; font-size: 12px; }
.ai-rule-row span:last-child { color: #365744; border: 1px solid #cbd8c5; border-radius: 3px; padding: 2px 6px; font-size: 10px; }
.ai-diagram-note { margin-top: 17px; color: #a5bbb3; font-size: 10px; line-height: 1.65; }
.ai-principles { background: #eaf0e5; border-bottom: 1px solid #dbe3d7; }
.ai-principles .section-inner { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; padding-top: 22px; padding-bottom: 22px; }
.ai-principles span { color: #435849; font-size: 12px; font-weight: 650; }
.ai-principles span::before { content: '↗'; margin-right: 10px; color: var(--teal); }
.ai-section .eyebrow, .ai-final-cta .eyebrow { color: #3d7160; font-size: 11px; letter-spacing: .11em; }
.ai-section h2, .ai-dark-section h2, .ai-final-cta h2 { font-size: clamp(32px, 3.5vw, 46px); line-height: 1.14; letter-spacing: -.035em; }
.ai-section .section-title h2 { margin-top: 15px; }
.ai-section .section-title p { font-size: 17px; }
.ai-section .section-head .section-title { max-width: 740px; }
.ai-section-aside { max-width: 300px; color: var(--muted); line-height: 1.7; font-size: 15px; }
.ai-index { display: block; color: #557464; font-size: 10px; font-weight: 750; letter-spacing: .12em; }
.ai-scenarios { gap: 36px; margin-top: 40px; }
.ai-scenarios article { padding-top: 22px; border-top: 1px solid #cad8ce; }
.ai-scenarios h3 { margin-top: 20px; font-size: 21px; letter-spacing: -.02em; }
.ai-scenarios p { margin-top: 12px; font-size: 15px; line-height: 1.75; color: var(--muted); }
.ai-service-cards .card { padding: 30px; box-shadow: 0 8px 20px rgba(31, 58, 43, .025); }
.ai-service-cards h3 { margin-top: 22px; }
.ai-service-cards p, .ai-service-cards li, .ai-deliverables li { font-size: 15px; }
.ai-service-cards ul, .ai-deliverables ul { padding-top: 17px; border-top: 1px solid var(--line); }
.ai-service-cards li::before, .ai-deliverables li::before { content: '—'; color: #64836e; margin-right: 8px; }
.ai-accountability { display: grid; grid-template-columns: 1.15fr 1fr; gap: 90px; align-items: center; }
.ai-accountability .ai-text-link { margin-top: 24px; }
.ai-questions p { padding: 22px 0; border-bottom: 1px solid var(--line); font-size: 20px; line-height: 1.5; letter-spacing: -.02em; }
.ai-questions span { display: block; margin-top: 20px; font-size: 12px; line-height: 1.65; color: var(--muted); }
.ai-dark-section { background: #153b37; color: #f2f5ea; }
.ai-dark-section .eyebrow { color: #b5dca8; font-size: 11px; margin-bottom: 15px; }
.ai-dark-section .ai-section-aside { color: #bfd0c5; }
.ai-practice-grid { gap: 40px; margin-top: 44px; }
.ai-practice-grid article { border-top: 1px solid #4d6c5e; padding-top: 24px; }
.ai-practice-grid h3 { font-size: 20px; }
.ai-practice-grid p { margin-top: 14px; color: #c0d0c7; font-size: 15px; line-height: 1.8; }
.ai-delivery-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 0; margin: 45px 0 30px; list-style: none; gap: 36px; }
.ai-delivery-steps li { border-top: 2px solid #bfd4ba; padding-top: 22px; }
.ai-delivery-steps h3 { margin-top: 18px; font-size: 21px; }
.ai-delivery-steps p { margin-top: 12px; color: var(--muted); font-size: 15px; line-height: 1.75; }
.ai-delivery-steps small { display: block; margin-top: 18px; color: #345b43; font-size: 12px; line-height: 1.6; font-weight: 650; }
.ai-scope-note { border-left: 2px solid #a5b69b; background: #f0f3ed; padding: 17px 22px; color: #526354; font-size: 13px; line-height: 1.7; }
.ai-founder-strip { display: grid; grid-template-columns: 1.4fr 1fr; gap: 100px; align-items: center; }
.ai-founder-strip h2 { margin-top: 15px; }
.ai-founder-strip p { margin-top: 20px; color: var(--muted); line-height: 1.75; font-size: 16px; }
.ai-founder-strip .ai-text-link { margin-top: 20px; }
.ai-founder-strip aside { border-left: 1px solid #cad8ce; padding-left: 40px; }
.ai-founder-strip h3 { margin-top: 18px; font-size: 23px; }
.ai-final-cta { text-align: center; background: #f7f8f2; }
.ai-final-cta h2 { margin-top: 18px; }
.ai-final-cta p { color: var(--muted); line-height: 1.65; margin-top: 20px; }
.ai-final-cta .button { margin-top: 28px; }
.ai-page-heading { color: var(--ink); font-size: clamp(42px, 5.5vw, 68px); line-height: 1.07; letter-spacing: -.04em; }
.ai-intake-note { background: #eef3e9; border-left: 2px solid #a6bea0; padding: 26px; margin-top: 28px; }
.ai-intake-note p { margin-top: 12px; color: var(--muted); font-size: 15px; line-height: 1.7; }
.ai-intake-note .button { margin-top: 24px; }
.ai-form-note { margin-top: 16px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.ai-form-note a { text-decoration: underline; }
.ai-founder-note { background: #163b37; padding: 38px; border-radius: 8px; color: #f2f5ea; }
.ai-founder-note .ai-index { color: #bdd0b2; }
.ai-founder-note p { margin-top: 25px; font-size: 27px; line-height: 1.5; letter-spacing: -.025em; }
.ai-founder-note > span:last-child { display: block; margin-top: 28px; font-size: 12px; line-height: 1.7; color: #b8cbc0; }
#pilot, #get-started { scroll-margin-top: 96px; }
.ai-hero a:focus-visible, .ai-section a:focus-visible, .ai-final-cta a:focus-visible, .resource-menu summary:focus-visible { outline: 3px solid #a78725; outline-offset: 5px; }
@media (max-width: 1100px) {
    .ai-hero-grid { gap: 35px; }
    .ai-accountability, .ai-founder-strip { gap: 45px; }
}
@media (max-width: 960px) {
    .ai-hero-grid { grid-template-columns: 1fr; gap: 48px; padding-top: 56px; padding-bottom: 50px; }
    .ai-hero h1 { font-size: clamp(56px, 9vw, 78px); }
    .ai-hero-copy { max-width: 600px; }
    .ai-boundary { max-width: 590px; }
    .ai-principles .section-inner { grid-template-columns: 1fr 1fr; }
    .ai-accountability, .ai-founder-strip, .ai-delivery-steps { grid-template-columns: 1fr; gap: 38px; }
    .ai-section .section-head, .ai-dark-section .section-head { align-items: flex-start; }
    .ai-section-aside { max-width: 540px; }
    .ai-founder-strip aside { border-left: 0; border-top: 1px solid #cad8ce; padding: 28px 0 0; }
}
@media (max-width: 640px) {
    .ai-section, .ai-dark-section, .ai-final-cta { padding: 56px 0; }
    .ai-hero .hero-actions { align-items: flex-start; gap: 20px; }
    .ai-hero .button { white-space: normal; padding: 12px 15px; text-align: left; }
    .ai-hero-copy { font-size: 17px; }
    .ai-boundary { padding: 16px; }
    .ai-policy-box { padding: 17px; }
    .ai-policy-box h2 { font-size: 22px; }
    .ai-policy-brand span { font-size: 8px; }
    .ai-channels, .ai-outcomes { gap: 5px; }
    .ai-channels span, .ai-outcomes span { font-size: 10px; }
    .ai-principles .section-inner { gap: 15px 10px; }
    .ai-principles span { font-size: 10px; }
    .ai-principles span::before { margin-right: 5px; }
    .ai-service-cards .card { padding: 24px; }
    .ai-founder-note { padding: 28px; }
}

/* Visual-first homepage: self-contained illustrations and a lightweight demo. */
.vx-symbols { position: absolute; width: 0; height: 0; overflow: hidden; }
.vx-hero { background: #102a35; color: #f6f8ef; background-image: radial-gradient(ellipse at 75% 50%, #214e4c 0, transparent 60%); }
.vx-hero-grid { display: grid; grid-template-columns: .8fr 1.3fr; gap: 45px; align-items: center; padding-block: 65px; }
.vx-intro .eyebrow { font-size: 10px; letter-spacing: .12em; line-height: 1.7; }
.vx-intro h1 { font-size: clamp(40px, 4.1vw, 60px); line-height: 1.08; letter-spacing: -.045em; margin-top: 22px; }
.vx-intro h1 em { font-style: normal; color: #bce7ac; }
.vx-intro > p { color: #c0d3d1; font-size: 18px; line-height: 1.7; margin: 22px 0 28px; max-width: 390px; }
.vx-intro .button { background: #c5e9b4; border-color: #c5e9b4; color: #163a31; gap: 20px; }
.vx-intro .button:hover { background: #def4d3; }
.vx-secondary-link { display: inline-block; color: #d3e4dd; font-size: 13px; margin: 18px 0 0 16px; text-decoration: underline; text-underline-offset: 5px; }
.vx-intro-note { font-size: 11px; color: #91b1a9; margin-top: 30px; }
.vx-demo { min-width: 0; border: 1px solid #466363; border-radius: 20px; background: #102d36c9; box-shadow: 0 35px 80px #00191c44; padding: 22px; }
.vx-demo-top { display: flex; justify-content: space-between; gap: 12px; color: #a7bfb9; font-size: 9px; letter-spacing: .08em; align-items: center; }
.vx-demo-top > span:last-child { letter-spacing: 0; font-size: 10px; border: 1px solid #46635f; border-radius: 20px; padding: 4px 8px; }
.vx-demo-top i { display: inline-block; background: #b7e4a8; width: 5px; height: 5px; border-radius: 50%; margin-right: 6px; }
.vx-pause[hidden] { display: none; }
.vx-flow { display: block; width: 100%; height: auto; margin-block: 15px 8px; overflow: visible; }
.vx-flow text { fill: #d8e7df; font-family: inherit; font-size: 12px; letter-spacing: .04em; }
.vx-flow .vx-svg-small { fill: #a9c6bc; font-size: 11px; letter-spacing: 0; }
.vx-flow .vx-app-symbol { fill: #cceac4; font-size: 29px; }
.vx-flow .vx-gateway-name { fill: #bde8ad; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.vx-track { fill: none; stroke: #4c7775; stroke-width: 2; stroke-dasharray: 4 7; }
.vx-stream { fill: none; stroke: #8fd5b0; stroke-width: 2; opacity: .3; }
.vx-moving-file { transform: translate(495px, 141px); }
.vx-file-alert { display: none; }
.vx-demo[data-paused=false] .vx-moving-file { animation: vx-transfer 4s infinite ease-in-out; }
.vx-demo[data-paused=false] .vx-ring { animation: vx-breathe 4s infinite ease-in-out; }
.vx-demo[data-scenario=personal] .vx-moving-file, .vx-demo[data-scenario=secret] .vx-moving-file { transform: translate(299px, 141px); animation-name: vx-review; }
.vx-demo[data-scenario=personal] .vx-file-alert, .vx-demo[data-scenario=secret] .vx-file-alert { display: block; }
.vx-demo[data-scenario=personal] .vx-screen-lines { stroke: #e2b46b; }
.vx-demo[data-scenario=secret] .vx-screen-lines { stroke: #dd9c8d; }
.vx-demo[data-scenario=secret] .vx-stream, .vx-demo[data-scenario=personal] .vx-stream { opacity: .05; }
.vx-feedback { display: flex; gap: 12px; align-items: center; background: #274b42; border: 1px solid #537a62; padding: 16px; border-radius: 10px; min-height: 83px; transition: background .3s, border-color .3s; }
.vx-status-icon { width: 26px; height: 26px; flex-shrink: 0; display: grid; place-items: center; background: #bde7aa; color: #204e3a; border-radius: 50%; font-size: 16px; font-weight: 800; }
.vx-feedback strong { font-size: 13px; font-weight: 650; }
.vx-feedback p { font-size: 11px; line-height: 1.6; color: #b6cec0; margin-top: 5px; }
.vx-status-tag { margin-left: auto; font-size: 10px; border: 1px solid #789d7f; padding: 4px 7px; border-radius: 4px; }
.vx-demo[data-scenario=personal] .vx-feedback { background: #484334; border-color: #9e885a; }
.vx-demo[data-scenario=personal] .vx-status-icon { background: #efc785; }
.vx-demo[data-scenario=secret] .vx-feedback { background: #4a3736; border-color: #956c61; }
.vx-demo[data-scenario=secret] .vx-status-icon { background: #e6a596; }
.vx-demo-bottom { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-top: 15px; font-size: 9px; line-height: 1.6; color: #9bb6ae; }
.vx-pause { border: 0; background: none; color: #c9ded3; font: inherit; font-size: 10px; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; cursor: pointer; padding: 6px 0; }
.vx-trust-strip { background: #e9eee2; border-bottom: 1px solid #d7e1d3; }
.vx-trust-strip .section-inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 25px; padding-block: 20px; color: #4e6b5c; font-size: 12px; }
.vx-trust-strip span::before { content: '↗'; color: #467861; margin-right: 10px; }
.vx-section-heading { text-align: center; max-width: 660px; margin: 0 auto 40px; }
.vx-section-heading .eyebrow, .vx-human-copy .eyebrow { color: #577b65; font-size: 10px; letter-spacing: .11em; }
.vx-section-heading h2, .vx-human-copy h2 { font-size: clamp(32px, 3.6vw, 47px); letter-spacing: -.04em; line-height: 1.15; margin-top: 16px; }
.vx-section-heading p { margin: 18px auto 0; max-width: 540px; font-size: 16px; line-height: 1.7; color: var(--muted); }
.vx-visual-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 25px; }
.vx-art { height: 270px; border-radius: 12px; background: #ecf1e8; border: 1px solid #dae3d5; overflow: hidden; padding: 18px; }
.vx-art svg { display: block; width: 100%; height: 215px; }
.vx-art-label { font-size: 9px; color: #648171; font-weight: 700; letter-spacing: .11em; }
.vx-app-art { background: #e9f0ed; }
.vx-report-art { background: #f0f0e7; }
.vx-story h3 { margin: 22px 0 12px; font-size: 20px; line-height: 1.3; letter-spacing: -.02em; }
.vx-story > p { color: var(--muted); font-size: 15px; line-height: 1.7; max-width: 360px; }
.vx-report { margin-top: 17px; padding: 16px; background: #fff; border-radius: 9px; box-shadow: 0 12px 25px #244e3510; transform: rotate(-2deg); }
.vx-report-heading { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; color: #315946; }
.vx-report-heading > span { font-size: 9px; color: #7a8d80; }
.vx-report-total { display: flex; align-items: baseline; gap: 8px; margin-top: 13px; color: #264f40; }
.vx-report-total strong { font-size: 34px; line-height: 1; letter-spacing: -.05em; }
.vx-report-total span { max-width: 85px; font-size: 9px; line-height: 1.25; color: #667c70; }
.vx-report-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 13px; }
.vx-report-metrics div { min-width: 0; padding: 9px 7px; border-radius: 6px; background: #edf3ec; }
.vx-report-metrics div:nth-child(2) { background: #f3efdf; }
.vx-report-metrics div:nth-child(3) { background: #eaf1ef; }
.vx-report-metrics b { display: block; color: #315946; font-size: 17px; line-height: 1; }
.vx-report-metrics span { display: block; margin-top: 5px; color: #6f8076; font-size: 7px; line-height: 1.25; }
.vx-report-footer { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 5px 10px; border-top: 1px solid #e6eae2; padding-top: 9px; margin-top: 11px; font-size: 8px; color: #6b8976; }
.vx-report-footer strong { color: #9a5c4d; }
.vx-human-section { padding: 72px 0; background: #eaf0e6; }
.vx-human-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: center; }
.vx-coaching-art { min-height: 340px; position: relative; padding: 10px 15px 30px; }
.vx-message-paper { width: 72%; max-width: 310px; border: 1px solid #d0dacc; background: #fffef8; padding: 22px 26px 45px; border-radius: 8px; transform: rotate(-5deg); margin: 0 0 0 35px; box-shadow: 0 18px 28px #294d3320; }
.vx-message-paper > span { font-size: 12px; color: #638773; }
.vx-paper-line { width: 100%; background: #e0e6db; height: 6px; border-radius: 4px; margin-top: 18px; }
.vx-paper-line.short { width: 70%; }
.vx-message-paper mark { display: block; background: #f1dfad; color: #867039; font-size: 11px; margin-top: 15px; padding: 7px; border-radius: 3px; }
.vx-coaching-note { position: relative; display: flex; gap: 17px; margin: -30px 0 0 45px; padding: 24px; border: 1px solid #507264; border-radius: 11px; background: #1f453b; box-shadow: 0 20px 35px #193b3325; }
.vx-coaching-icon { border-radius: 50%; color: #354b32; background: #e5cb8d; width: 30px; height: 30px; flex-shrink: 0; display: grid; place-items: center; font-weight: 800; }
.vx-coaching-note strong { font-size: 17px; color: #eef4dd; }
.vx-coaching-note p { color: #c4d3c1; font-size: 12px; line-height: 1.7; margin-top: 9px; }
.vx-example-action { display: inline-block; background: #c0d9aa; color: #2c4f36; font-size: 10px; padding: 7px 10px; border-radius: 4px; margin-top: 13px; }
.vx-caption { display: block; text-align: center; font-size: 9px; line-height: 1.5; color: #768e7a; margin-top: 20px; }
.vx-human-copy p { color: var(--muted); line-height: 1.8; font-size: 17px; margin: 22px 0; }
.vx-pricing-section { background: #f8faf5; border-top: 1px solid #e3e9dd; border-bottom: 1px solid #e3e9dd; }
.vx-pricing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.vx-pricing-card { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 30px; border: 1px solid #d8e2d5; border-radius: 14px; background: #fff; box-shadow: 0 16px 38px #1d49300a; }
.vx-pricing-card.featured { border-color: #5e9276; box-shadow: 0 22px 48px #1d493018; }
.vx-pricing-card.custom { background: #173a3d; border-color: #173a3d; color: #eff6e9; }
.vx-plan-badge { position: absolute; top: -12px; right: 22px; padding: 6px 10px; border-radius: 20px; background: #cbeab8; color: #234c36; font-size: 9px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.vx-plan-name { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding-bottom: 18px; border-bottom: 1px solid #e5ebe2; }
.vx-plan-name span { color: #21483a; font-size: 20px; font-weight: 800; }
.vx-plan-name small { color: #809086; font-size: 10px; }
.vx-pricing-card.custom .vx-plan-name { border-color: #416061; }
.vx-pricing-card.custom .vx-plan-name span { color: #eaf4e4; }
.vx-pricing-card.custom .vx-plan-name small { color: #a7c0b8; }
.vx-plan-price { display: flex; align-items: center; gap: 13px; margin-top: 26px; }
.vx-plan-price strong { color: #173e34; font-size: 46px; line-height: 1; letter-spacing: -.05em; }
.vx-plan-price span { color: #718279; font-size: 10px; line-height: 1.45; }
.vx-plan-price.text-price { align-items: flex-start; }
.vx-plan-price.text-price strong { max-width: 150px; color: #eaf4e4; font-size: 29px; line-height: 1.05; letter-spacing: -.035em; }
.vx-pricing-card.custom .vx-plan-price span { color: #b6ccc3; }
.vx-plan-minimum { min-height: 35px; margin-top: 14px; color: #577063; font-size: 11px; font-weight: 750; line-height: 1.5; }
.vx-pricing-card.custom .vx-plan-minimum { color: #b9cdc5; }
.vx-pricing-card ul { display: grid; gap: 11px; margin: 22px 0 28px; padding: 0; list-style: none; color: #56685f; font-size: 12px; line-height: 1.45; }
.vx-pricing-card li { position: relative; padding-left: 17px; }
.vx-pricing-card li::before { content: '✓'; position: absolute; left: 0; color: #4f8a69; font-weight: 800; }
.vx-pricing-card.custom ul { color: #c2d2cc; }
.vx-pricing-card.custom li::before { color: #bce4ac; }
.vx-plan-link { margin-top: auto; padding-top: 16px; border-top: 1px solid #e5ebe2; color: #2d7051; font-size: 11px; font-weight: 800; }
.vx-pricing-card.custom .vx-plan-link { border-color: #416061; color: #c8e8b9; }
.vx-pricing-note { max-width: 880px; margin: 26px auto 0; color: #75857b; font-size: 10px; line-height: 1.7; text-align: center; }
.vx-close { text-align: center; background: #fafbf6; }
.vx-pilot-road { display: flex; align-items: center; justify-content: center; gap: 25px; margin: 0 0 35px; }
.vx-pilot-road span { color: #486252; font-size: 13px; }
.vx-pilot-road b { display: inline-grid; place-items: center; border-radius: 50%; background: #e7eedf; color: #64866a; font-size: 10px; width: 32px; height: 32px; margin-right: 8px; }
.vx-pilot-road i { color: #9dae98; font-style: normal; }
.vx-limits { max-width: 600px; margin: 24px auto 0; font-size: 11px; line-height: 1.8; color: #81907d; }
.vx-bottom-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 20px; margin-top: 34px; font-size: 12px; color: #54745d; }
.vx-hero :focus-visible { outline: 2px solid #e5cf8a; outline-offset: 4px; }
@keyframes vx-transfer { 0%, 8% { transform: translate(145px, 141px); opacity: 0; } 18% { opacity: 1; } 48% { transform: translate(309px, 141px); opacity: 1; } 84% { transform: translate(495px, 141px); opacity: 1; } 100% { transform: translate(515px, 141px); opacity: 0; } }
@keyframes vx-review { 0%, 10% { transform: translate(145px, 141px); opacity: 0; } 25% { opacity: 1; } 50%, 100% { transform: translate(299px, 141px); opacity: 1; } }
@keyframes vx-breathe { 50% { opacity: .4; } }
@media (max-width: 1100px) {
    .vx-hero-grid { gap: 28px; grid-template-columns: .8fr 1.2fr; }
    .vx-demo { padding: 16px; }
    .vx-feedback { padding: 12px; }
    .vx-status-tag { display: none; }
    .vx-secondary-link { margin-left: 0; display: block; }
    .vx-human-grid { gap: 35px; }
    .vx-visual-grid { gap: 18px; }
    .vx-pricing-grid { gap: 14px; }
    .vx-pricing-card { padding: 24px 20px; }
    .vx-art { padding: 14px; }
    .vx-report { padding: 13px; }
}
@media (max-width: 800px) {
    .vx-hero-grid { grid-template-columns: 1fr; padding-block: 38px; gap: 32px; }
    .vx-intro { text-align: center; }
    .vx-intro h1 { max-width: 570px; margin-inline: auto; font-size: 46px; }
    .vx-intro h1 em br { display: none; }
    .vx-intro > p { max-width: 440px; margin: 18px auto 22px; font-size: 16px; }
    .vx-secondary-link { display: inline-block; margin: 0 0 0 20px; }
    .vx-intro-note { display: none; }
    .vx-demo { width: 100%; max-width: 620px; margin-inline: auto; }
    .vx-visual-grid { grid-template-columns: 1fr; gap: 34px; }
    .vx-art { height: 260px; }
    .vx-art svg { height: 210px; }
    .vx-report { max-width: 300px; margin: 18px auto 0; }
    .vx-story > p { max-width: none; }
    .vx-human-grid { grid-template-columns: 1fr; gap: 25px; }
    .vx-pricing-grid { grid-template-columns: 1fr; gap: 24px; max-width: 560px; margin-inline: auto; }
    .vx-plan-minimum { min-height: 0; }
    .vx-coaching-art { max-width: 500px; width: 100%; margin: auto; }
    .vx-pilot-road { flex-direction: column; align-items: flex-start; gap: 15px; width: max-content; margin-inline: auto; }
    .vx-pilot-road i { display: none; }
}
@media (max-width: 480px) {
    .vx-hero-grid { padding-top: 28px; gap: 26px; }
    .vx-intro h1 { font-size: 37px; margin-top: 16px; }
    .vx-intro > p { font-size: 14px; line-height: 1.6; }
    .vx-intro .eyebrow { font-size: 8px; }
    .vx-secondary-link { font-size: 11px; margin-left: 12px; }
    .vx-demo { border-radius: 12px; padding: 12px; }
    .vx-demo-top { font-size: 7px; letter-spacing: .03em; gap: 5px; }
    .vx-demo-top > span:last-child { font-size: 8px; }
    .vx-flow { margin-block: 8px; }
    .vx-feedback { gap: 8px; min-height: 78px; padding: 10px; }
    .vx-feedback strong { font-size: 11px; }
    .vx-feedback p { font-size: 10px; }
    .vx-demo-bottom { font-size: 8px; margin-top: 10px; }
    .vx-pause { font-size: 9px; }
    .vx-trust-strip .section-inner { justify-content: center; font-size: 10px; gap: 10px 15px; padding-block: 15px; }
    .vx-visual-section, .vx-close { padding-block: 50px; }
    .vx-human-section { padding-block: 40px; }
    .vx-message-paper { margin-left: 5px; padding: 20px; width: 80%; }
    .vx-coaching-note { margin-left: 15px; padding: 20px 15px; gap: 10px; }
    .vx-human-copy p { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
    .vx-demo *, .vx-orbit-dot { animation: none !important; transition: none !important; }
    .vx-orbit-dot { display: none; }
}

@media print {
    .sidebar,
    .workspace-head .button,
    .no-print,
    .inline-actions,
    details.edit-panel,
    form {
        display: none !important;
    }

    .print-only {
        display: block;
    }

    .shell {
        display: block;
        background: #fff;
    }

    .workspace {
        padding: 0;
    }

    .card,
    .metric {
        break-inside: avoid;
        box-shadow: none;
    }
}

@media (max-width: 640px) {
    .nav-shell,
    .section-inner,
    .hero-inner {
        width: min(100% - 28px, 1180px);
    }

    .brand img {
        width: 128px;
    }

    .mobile-menu-panel {
        right: -2px;
    }

    .section {
        padding: 60px 0;
    }

    .section-head,
    .footer .section-inner {
        display: block;
    }

    .form-grid {
        grid-template-columns: 1fr;
    }

    .workspace {
        padding: 22px;
    }
}