/* TrajexCar typography and legibility · September 2026 */
:root {
  --tx-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --tx-text: #0b1736;
  --tx-text-secondary: #4b5870;
  --tx-text-subtle: #68758b;
  --tx-h1: clamp(48px, 4vw, 56px);
  --tx-h2: clamp(32px, 3vw, 38px);
  --tx-h3: clamp(21px, 2vw, 24px);
  --tx-body: 17px;
  --tx-small: 13px;
  --tx-leading: 1.6;
}
html { -webkit-text-size-adjust: 100%; }
body, body.premium-design, body:has(>.site-header), body.premium-design #homeView, body.premium-design #homeView .live-shell {
  font-family: var(--tx-font); color: var(--tx-text); font-size: var(--tx-body); line-height: var(--tx-leading);
}
body :is(button,input,select,textarea) {font-family:var(--tx-font)}
body :is(a,button,input,select,textarea,summary):focus-visible {outline:3px solid #1749eb;outline-offset:3px}
body :is(input,textarea)::placeholder {color:#64718a;opacity:1}
body :is(button,input,select,textarea):disabled {opacity:.6}

/* Public pages */
.premium-design .hero h1, body:has(>.site-header) .hero h1 {font-size:var(--tx-h1);font-weight:800;line-height:1.1}
.premium-design :is(.section-head h2,.story-copy h2,#how h2,.regions h2,.safety h2),
body:has(>.site-header) .section h2 {font-size:var(--tx-h2);font-weight:750;line-height:1.16}
.premium-design :is(.story-copy p,.section-head p,.intro),
body:has(>.site-header) :is(.hero-copy>p:not(.availability),.section-head>p,.story-main>p,.network-content p,.audience>p) {font-size:var(--tx-body);line-height:1.6;color:var(--tx-text-secondary);max-width:68ch}
.premium-design :is(.hero .lead,.feature p,.step p,.safety p,.tx-driver-transition p,.tx-community-line p),
body:has(>.site-header) :is(.steps p,.network-card p,.audience-grid p,.network-mobility p) {font-size:15px;line-height:1.55;color:var(--tx-text-secondary)}
.premium-design :is(.eyebrow,.trustline,.stat span,.tx-flow-line small,.tx-route-start,.tx-result-price small,.tx-result-person small,.tx-premium-badge),
body:has(>.site-header) :is(.eyebrow,.availability,.story-main .caption,.territory-stop small,.territory-mark,.metric-preview small,.network-mobility small) {font-size:var(--tx-small);line-height:1.45;color:var(--tx-text-secondary)}
.premium-design :is(.nav .links>a,.tx-home-nav .tx-links>a),body:has(>.site-header) .desktop-nav {font-size:15px;font-weight:700;color:#243b60}
.premium-design :is(.nav .links>a.tx-publish-nav,.tx-home-nav .tx-links>a.tx-publish-nav,.nav .links>a.nav-cta,.tx-home-nav .tx-links>a.tx-nav-cta),
body:has(>.site-header) :is(.header-publish,.header-login) {font-size:15px;font-weight:700;min-height:44px}
.premium-design :is(.nav .links>a[aria-current],.tx-home-nav .tx-links>a[aria-current]),body:has(>.site-header) .desktop-nav a[aria-current] {color:#1749eb;border-color:#1749eb}
.premium-design :is(.nav .links>a,.tx-home-nav .tx-links>a):hover,body:has(>.site-header) .desktop-nav a:hover {color:#1749eb}
.premium-design :is(.btn,.button,.search,.tx-result-link,.tx-community-line>a),body:has(>.site-header) :is(.button,.text-link,.audience-link) {font-size:15px;font-weight:700}
.premium-design #finder .field label,.premium-design #homeView :is(.live-search label,.live-publish label,.live-profile label,.live-alerts label) {font-size:14px;font-weight:600;color:#33435e}
.premium-design #finder .field label {font-size:14px!important;color:#33435e!important;font-family:var(--tx-font)!important}
.premium-design #finder :is(input,select,textarea),.premium-design #homeView :is(input,select,textarea):not([type=checkbox]):not([type=radio]),
.premium-design #authView input:not([type=checkbox]) {font-size:16px;min-height:46px}
.premium-design #finder :is(input,select,textarea) {font-size:16px!important;font-family:var(--tx-font)!important}
.premium-design #finder .field input,.premium-design #finder .tx-driver-time input {font-size:16px!important;min-height:26px!important;font-family:var(--tx-font)!important}
.premium-design #finder .field input::placeholder {font-weight:500;color:#64718a!important}
.premium-design #finder :is(.switch button,.search),.premium-design #homeView :is(.live-card button,.live-publish button,.live-profile button,.live-alerts button,.live-search button,.live-account button,.live-verify button) {font-size:15px;min-height:44px}
.premium-design #finder :is(.switch button,.search) {font-size:15px!important;font-family:var(--tx-font)!important}
.premium-design #finder .search b {font-size:15px!important}
.premium-design #authView main p,.premium-design #authView>p {font-size:16px;line-height:1.6;color:var(--tx-text-secondary)}
.premium-design #authView .hero p {font-size:16px!important;line-height:1.6!important;color:var(--tx-text-secondary)!important}
.premium-design #authView .trust span {font-size:13px;line-height:1.5;color:var(--tx-text-secondary)}
.premium-design #authView #authForm label,.premium-design #authView label {font-size:14px;font-weight:600;color:#33435e;line-height:1.45}
.premium-design #authView label.check {font-size:13px;min-height:44px;display:inline-flex;align-items:center}
.premium-design #authView :is(.tab,.primary) {font-size:16px;min-height:44px;font-weight:650}
.premium-design #authView :is(a,.message) {font-size:14px;line-height:1.5}
.premium-design #homeView :is(.live-activity p,.live-account p,.live-help p,.live-search p,.live-publish>p,.live-profile>p,.live-card p) {font-size:15px;line-height:1.55;color:var(--tx-text-secondary)}
.premium-design #homeView :is(.live-tabs button,.live-header-nav a,.live-header #live-logout) {font-size:14px;min-height:44px}
.premium-design #homeView :is(.live-card-head strong,.live-search strong) {font-size:20px;line-height:1.3}
.premium-design #homeView :is(.live-help li,.live-support p,.live-notifications p,.live-activity-row span) {font-size:15px;line-height:1.55}
.premium-design #homeView :is(.live-site-footer a,.live-site-footer p,.live-section-head p) {font-size:14px;line-height:1.55}
.premium-design #homeView :is(.live-stat span:not(.live-stat-icon),.live-publish-note,.live-stop-fields legend) {font-size:13px;line-height:1.45}
.premium-design :is(.tx-home-dock .tx-tab,.mobile-tab) {font-size:13px;line-height:1.2}
.premium-design :is(.tx-home-dock .tx-tab,.mobile-tab) span {font-size:13px}
.premium-design .tx-flow-line small {font-size:13px}
.premium-design #how .step p {font-size:15px;line-height:1.5}
.premium-design .region a.tx-route-link {font-size:16px!important;min-height:44px}
.premium-design .tx-route-start {font-size:13px}
body:has(>.site-header) .steps h3 {font-size:19px;line-height:1.3}
body:has(>.site-header) .audience-grid h3 {font-size:22px}
body:has(>.site-header) .network-mobility .everyday-places strong {font-size:13px;line-height:1.3}
body:has(>.site-header) .territory-stop small {font-size:13px}
body:has(>.site-header) .metric-preview small {font-size:13px}
body.tx-typography-admin {font-family:var(--tx-font);font-size:16px;line-height:1.6;color:var(--tx-text)}
body.tx-typography-admin :is(input,select,textarea) {font-size:16px;min-height:44px}
body.tx-typography-admin :is(label,button) {font-size:15px;line-height:1.4}
body.tx-typography-admin :is(p,small) {color:var(--tx-text-secondary)}

/* Existing guide: visual overview, with detailed status kept visible. */
.premium-design.premium-guide .intro {font-size:17px;line-height:1.6;max-width:68ch}
.premium-design.premium-guide>main>.eyebrow,.premium-design.premium-guide main>section>.eyebrow {font-size:13px;color:#1749eb}
.premium-design.premium-guide h1 {font-size:var(--tx-h1);line-height:1.1;max-width:18ch}
.premium-design.premium-guide h2 {font-size:var(--tx-h2);line-height:1.16}
.premium-design.premium-guide main>section p {font-size:16px;line-height:1.6;color:var(--tx-text-secondary);max-width:68ch}
.premium-design.premium-guide .button {font-size:16px;min-height:46px;font-weight:700}
.tx-guide-visual {display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}
.tx-guide-panel {background:#f4f8ff;border:1px solid #dce8f8;border-radius:18px;padding:20px}
.tx-guide-panel strong {font-size:15px;color:#1546c9}
.tx-guide-route {display:flex;align-items:center;gap:9px;margin-top:11px;color:#0b1736;font-size:18px;font-weight:700;white-space:nowrap}
.tx-guide-route .line {flex:1;min-width:35px;height:2px;background:#1b51e8;position:relative}
.tx-guide-route .line:after {content:'➜';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#f4f8ff;padding:0 6px;color:#1b51e8;font-size:17px}
.tx-guide-route.return .line:after {content:'⬅'}
.tx-guide-territory {display:flex;align-items:center;gap:12px;margin:20px 0;padding:18px;border:1px solid #dce8f8;border-radius:16px;background:#f4f8ff;color:#103c8b;font-weight:700}
.tx-guide-territory .bridge {font-size:24px;color:#1749eb}
.tx-guide-status {font-size:14px!important;color:#4b5870!important}

@media(max-width:1150px) and (min-width:851px) {
  .premium-design .nav .links>a,.premium-design.premium-guide .tx-links>a,body:has(>.site-header) .desktop-nav {font-size:14px}
  .premium-design .nav .links>a.tx-publish-nav,.premium-design.premium-guide .tx-links>a.tx-publish-nav,body:has(>.site-header) :is(.header-publish,.header-login) {font-size:14px}
}
@media(max-width:850px) {
  :root {--tx-h1:clamp(36px,8vw,42px);--tx-h2:clamp(28px,6.5vw,32px);--tx-h3:21px;--tx-body:16px}
  .premium-design .hero h1,body:has(>.site-header) .hero h1 {font-size:var(--tx-h1)}
  .premium-design .story-copy h2,body:has(>.site-header) .section h2 {font-size:var(--tx-h2)}
  .premium-design .tx-flow-line small {font-size:13px;line-height:1.3}
  .premium-design .story-copy p {font-size:16px}
  .premium-design #how .step p {font-size:15px}
  .premium-design .region a.tx-route-link {font-size:14px!important}
  .premium-design #finder :is(input,select,textarea),.premium-design #homeView :is(input,select,textarea):not([type=checkbox]):not([type=radio]) {font-size:16px}
  body:has(>.site-header) .steps p {font-size:15px}
  body:has(>.site-header) .network-mobility .everyday-places strong {font-size:13px}
  .premium-design.premium-guide .intro {font-size:16px}
  .tx-guide-visual {grid-template-columns:1fr;gap:12px}
  .tx-guide-route {font-size:16px}
  .tx-guide-territory {flex-wrap:wrap;font-size:15px}
}