:root {
  --tjl-ink: #182128;
  --tjl-dark: #10171d;
  --tjl-paper: #f6f5f1;
  --tjl-line: #deded7;
  --tjl-accent: #a53d19;
  --tjl-highlight: #ffab75;
  --tjl-font: 'DM Sans', 'Segoe UI', system-ui, sans-serif;
}
body { font-family: var(--tjl-font); }
:where(a, button, summary, input, textarea, select):focus-visible {
  outline: 3px solid #c76031;
  outline-offset: 4px;
}
.product-parent { background: #10171d; color: #d4dce0; font-size: .8rem; }
.product-parent .shell { padding-block: .45rem; }
.product-parent a:hover, .product-utilities a:hover { color: var(--tjl-highlight); }
.lp {
  --font-head: var(--tjl-font);
  --font-body: var(--tjl-font);
}
.lp .shell { width: min(75rem, calc(100% - 3rem)); }
.lp .header { background: #182128f5; }
.lp .header-inner { height: 70px; gap: clamp(1rem, 3vw, 2rem); }
.lp .header .brand-lockup { width: clamp(7.5rem, 17vw, 10rem); height: auto; }
.lp .desktop-nav { display: flex; gap: clamp(1rem, 2.7vw, 2rem); }
.lp .desktop-nav a { font-size: .875rem; color: #e8edf0; font-weight: 650; }
.lp .desktop-nav a:hover { color: var(--tjl-highlight); }
.lp .header-right { margin-left: 0; }
.lp .header .hamburger { display: none; }
.product-cta { display: inline-flex; align-items: center; min-height: 42px; padding-inline: .85rem; border-radius: .5rem; background: var(--tjl-highlight); color: var(--tjl-dark); font-size: .8rem; font-weight: 800; white-space: nowrap; }
.product-cta:hover { background: #ffd1b2; }
.lp .lp-hero { background: var(--tjl-dark); }
.lp .lp-hero-grid { min-height: 0; padding-block: clamp(2.75rem, 7vw, 5.75rem); gap: clamp(1.5rem, 4vw, 4rem); }
.lp .lp-hero h1 { margin-block: 1.1rem 1.35rem; font-size: clamp(2.8rem, 6vw, 5.75rem); font-weight: 750; line-height: 1.02; letter-spacing: -.055em; white-space: normal; }
.lp .lp-hero h1 em { color: var(--tjl-highlight); font-style: normal; }
.lp .lp-hero-desc { color: #c7d0d5; line-height: 1.7; }
.lp .lp-hero-visual { border-radius: 1rem; background: radial-gradient(ellipse, #3a342e, #222b32 72%); overflow: hidden; }
.lp .lp-hero-visual-foot { color: #c6cdd0; }
.lp .lp-button { border-radius: .5rem; }
.lp .lp-button-orange { color: var(--tjl-dark); background: var(--tjl-highlight); }
.lp .lp-about, .lp .lp-features, .lp .lp-start, .lp .lp-faq { background: var(--tjl-paper); color: var(--tjl-ink); }
.lp .lp-features { border-top: 1px solid var(--tjl-line); }
.lp main > section:not(.lp-hero) { padding-block: clamp(3rem, 7vw, 6rem); }
.lp .lp-about h2, .lp .lp-section-heading h2, .lp .lp-showcase-copy h2, .lp .lp-garage-copy h2,
.lp .lp-clubs-intro h2, .lp .lp-start h2, .lp .lp-faq h2, .lp .lp-download h2, .lp .lp-video h2 {
  font-size: clamp(2.15rem, 5vw, 4.5rem);
  letter-spacing: -.05em;
  line-height: 1.06;
}
.lp .lp-about h2 em, .lp .lp-features h2 em, .lp .lp-start h2 em, .lp .lp-faq h2 em, .lp .lp-features .lp-section-tag { color: var(--tjl-accent); }
.lp .lp-feature { padding: clamp(1rem, 2vw, 1.5rem); border-color: var(--tjl-line); background: #fff; }
.lp .lp-feature h3 { font-size: 1.3rem; line-height: 1.22; }
.lp .lp-feature > p { font-size: .875rem; min-height: 0; }
.lp .lp-feature-preview { height: 10rem; }
.lp .lp-footer { background: var(--tjl-dark); }
.product-utilities { display: flex; flex-wrap: wrap; gap: 1rem; padding-block: 1rem; color: #c7d0d5; font-size: .8rem; }

.tjl-public { --blue: #98401f; --ink: #182128; --muted: #526069; --line: #deded7; --paper: #f6f5f1; }
.tjl-public header { background: #f6f5f1f7; }
.tjl-public .wrap { max-width: 75rem; }
.tjl-public .nav { height: 74px; }
.tjl-public .page-intro { padding-block: clamp(2.75rem, 7vw, 5.25rem) 2rem; }
.tjl-public .page-intro h1 { font-size: clamp(2.35rem, 5vw, 4rem); line-height: 1.08; }
.tjl-public .card, .tjl-public .admin-panel { border-radius: 1rem; }
.tjl-public .button.secondary { background: #f9e9df; }
.tjl-public .button:hover, .tjl-public .nav-cta:hover { background: #753015; color: #fff; }
.tjl-public footer { border-top: 1px solid var(--line); margin-top: 2rem; }
.portal-body, .page-404 { --font-head: var(--tjl-font); --ink: #10171d; --ink2: #182128; --orange: #ffab75; }
.portal-body .login-showcase, .portal-body .super-central { background: #182128; }
.portal-body .super-central { border-radius: 1rem; }
.portal-body .login-showcase h1, .portal-body .super-central h1 { font-size: clamp(2.5rem, 5vw, 4.8rem); }
.tjl-console .auth-copy { background: radial-gradient(ellipse at 18% 55%, #36312c, #182128 75%); }
.tjl-console .auth-copy h1 { font-size: clamp(3rem, 7vw, 6rem); letter-spacing: -.06em; }
.tjl-investor .hero h1 { letter-spacing: -.055em; }
.tjl-investor :is(.opportunity-feature, .model-card, .placement-card, .roadmap-step) { border-radius: 1rem; }

@media (max-width: 900px) {
  .lp .desktop-nav { display: none; }
  .lp .header-right { margin-left: auto; }
  .lp .header .hamburger { display: block; }
  .lp .mobile-nav.open { display: flex; max-height: 65dvh; overflow: auto; }
}
@media (min-width: 901px) { .lp .mobile-nav.open { display: none; } }
@media (max-width: 720px) {
  .lp .shell { width: calc(100% - 2rem); }
  .lp .lp-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .lp .lp-about-grid { gap: 1.75rem; }
}

.lp .lp-services { background: var(--tjl-paper); color: var(--tjl-ink); }
.lp-services h2 { margin: 1rem 0 1.75rem; font-size: clamp(2rem, 4.4vw, 3.75rem); line-height: 1.08; letter-spacing: -.045em; }
.lp-service-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: .8rem; }
.lp-service-grid a { display: grid; align-content: start; gap: .45rem; min-height: 7rem; padding: 1.15rem; border: 1px solid var(--tjl-line); border-radius: .75rem; background: #fff; }
.lp-service-grid a:hover { border-color: var(--tjl-accent); }
.lp-service-grid strong { display: flex; justify-content: space-between; gap: .5rem; }
.lp-service-grid strong span { color: var(--tjl-accent); }
.lp-service-grid a > span { color: #526069; font-size: .9rem; }