.tms-svc {
  --navy:#061840; --navy-2:#0B1A3D; --navy-3:#13254F;
  --orange:#E8731C; --orange-dark:#C2560A; --orange-soft:#FFF1E6;
  --ink:#0B1A3D; --text:#3D4A63; --muted:#5A6780; --line:#E3E8F0;
  --bg:#FFFFFF; --bg-alt:#F4F6FA; --card:#FFFFFF;
  --green:#1B7F5A; --green-soft:#E3F4EC; --red:#B42318; --red-soft:#FEF3F2; --amber:#8A4A06; --amber-soft:#FDF1DC;
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark) { .tms-svc:not([data-theme="light"]) { --ink:#F2F5FA; --text:#C9D3E6; --muted:#AEBBD3; --line:#22365F; --bg:#0A1633; --bg-alt:#0E1C40; --card:#12234A; --orange-soft:#3A2A1E; --green-soft:#153A2E; --red-soft:#3A1E1E; --amber-soft:#3A2E1A; }
}
.tms-svc[data-theme="dark"] { --ink:#F2F5FA; --text:#C9D3E6; --muted:#AEBBD3; --line:#22365F; --bg:#0A1633; --bg-alt:#0E1C40; --card:#12234A; --orange-soft:#3A2A1E; --green-soft:#153A2E; --red-soft:#3A1E1E; --amber-soft:#3A2E1A; }
.tms-svc *, .tms-svc *::before, .tms-svc *::after { box-sizing:inherit; }
.tms-svc html { scroll-behavior:smooth; scroll-padding-top:calc(env(safe-area-inset-top,0px) + 16px); }
.tms-svc { margin:0; background:var(--bg); color:var(--ink); font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif; line-height:1.55; }
.tms-svc img, .tms-svc svg { max-width:100%; }
.tms-svc a { color:var(--orange-dark); }
.tms-svc .wrap { width:100%; max-width:1200px; margin:0 auto; padding:0 clamp(20px,5vw,40px); }
.tms-svc section { padding:clamp(40px,5vw,64px) 0; }
.tms-svc .alt { background:var(--bg-alt); }
.tms-svc .eyebrow { display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:700; color:var(--orange-dark); margin-bottom:12px; }
.tms-svc h2 { text-wrap:balance; margin:0 0 14px; font-size:clamp(28px,3.4vw,40px); line-height:1.15; letter-spacing:-0.02em; font-weight:800; }
.tms-svc h3 { margin:0 0 8px; font-size:18px; line-height:1.3; }
.tms-svc .lead { text-wrap:pretty; margin:0; font-size:clamp(16px,1.4vw,18px); color:var(--text); max-width:700px; }
.tms-svc .head { margin-bottom:clamp(24px,3vw,36px); }
.tms-svc .head.center { text-align:center; }
.tms-svc .head.center .lead { margin:0 auto; }
.tms-svc .head.center h2 { max-width:860px; margin-left:auto; margin-right:auto; }
.tms-svc .btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:0 26px; border-radius:12px; font-weight:700; font-size:16px; text-decoration:none; transition:background .2s ease,border-color .2s ease; }
.tms-svc .btn--primary { background:var(--orange); color:#fff; }
.tms-svc .btn--primary:hover { background:var(--orange-dark); }
.tms-svc .btn--ghost { border:1.5px solid rgba(255,255,255,.45); color:#fff; }
.tms-svc .btn--ghost:hover { border-color:#fff; }
.tms-svc .btn:focus-visible, .tms-svc a:focus-visible, .tms-svc summary:focus-visible, .tms-svc button:focus-visible { outline:3px solid var(--orange); outline-offset:3px; }
.tms-svc .check { flex:none; }
.tms-svc .inline-link { font-weight:600; }

/* ===== Hero ===== */
.tms-svc .hero { background:var(--navy); color:#fff; padding:clamp(40px,5vw,72px) 0; overflow:hidden; }
.tms-svc .hero .wrap { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:clamp(32px,5vw,64px); align-items:center; }
.tms-svc .tag { display:inline-flex; align-items:center; gap:10px; padding:8px 18px; font-size:14px; font-weight:700; color:#fff; background:rgba(232,115,28,.28); border:2px solid #F58C3C; border-radius:999px; }
.tms-svc .tag::before { content:""; width:9px; height:9px; border-radius:50%; background:#FF9646; }
.tms-svc .hero h1 { margin:16px 0 14px; font-size:clamp(32px,3.7vw,50px); line-height:1.08; font-weight:800; letter-spacing:-0.02em; }
.tms-svc .hero h1 .h1-top { display:block; text-wrap:balance; }
.tms-svc .hero h1 .h1-hl { display:block; color:#F0802A; }
.tms-svc .hero p { margin:0 0 28px; font-size:clamp(16px,1.4vw,18px); color:#D5DEEE; max-width:580px; }
.tms-svc .hero__ctas { display:flex; gap:14px; flex-wrap:wrap; }
.tms-svc .hero__points { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:24px 0 0; padding:0; list-style:none; font-size:14px; font-weight:600; color:#E6ECF6; max-width:560px; }
.tms-svc .hero__points li { display:flex; align-items:center; gap:8px; padding:10px 14px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); border-radius:999px; white-space:nowrap; }
.tms-svc .mock { background:#fff; border-radius:18px; box-shadow:0 30px 70px rgba(0,0,0,.35); overflow:hidden; color:#0B1A3D; }
.tms-svc .mock__bar { height:34px; background:#EEF1F6; display:flex; align-items:center; gap:6px; padding:0 14px; }
.tms-svc .mock__bar i { width:10px; height:10px; border-radius:50%; background:#CBD3DF; }
.tms-svc .mock__bar span { margin-left:10px; font-size:11px; color:#5A6780; background:#fff; padding:3px 12px; border-radius:6px; }
.tms-svc .mock__body { display:grid; grid-template-columns:124px minmax(0,1fr); }
.tms-svc .mock__nav { background:#0B1A3D; padding:16px 10px; display:flex; flex-direction:column; gap:4px; }
.tms-svc .mock__nav b { color:#fff; font-size:13px; padding:0 8px 10px; }
.tms-svc .mock__nav span { font-size:12px; font-weight:600; color:#A9B6CE; padding:7px 8px; border-radius:7px; }
.tms-svc .mock__nav span.on { background:#1E3160; color:#fff; }
.tms-svc .mock__main { background:#F6F8FB; padding:16px; display:flex; flex-direction:column; gap:12px; }
.tms-svc .mock__row { display:flex; justify-content:space-between; align-items:center; }
.tms-svc .mock__row strong { font-size:15px; }
.tms-svc .mock__row em { font-style:normal; font-size:11px; font-weight:700; color:#fff; background:#E8731C; padding:6px 10px; border-radius:7px; }
.tms-svc .mock__tiles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.tms-svc .mock__tiles div { background:#fff; border:1px solid #E6EBF3; border-radius:10px; padding:10px; }
.tms-svc .mock__tiles small { display:block; font-size:10px; font-weight:600; color:#5A6780; }
.tms-svc .mock__tiles b { font-size:17px; }
.tms-svc .mock table { width:100%; border-collapse:collapse; background:#fff; border:1px solid #E6EBF3; font-size:11px; }
.tms-svc .mock th { text-align:left; font-size:10px; color:#5A6780; font-weight:700; padding:8px 10px; background:#FAFBFD; }
.tms-svc .mock td { padding:8px 10px; border-top:1px solid #EEF1F6; color:#1F2D4A; }
.tms-svc .pill { font-size:10px; font-weight:700; padding:3px 8px; border-radius:999px; }
.tms-svc .pill.g { color:#1B7F5A; background:#E3F4EC; } .pill.o { color:#8A4A06; background:#FDEEE3; } .pill.b { color:#1D4ED8; background:#E4ECFD; }


/* ===== Problems ===== */
.tms-svc .problems { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.tms-svc .problem { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:24px; border-top:4px solid var(--red); }
.tms-svc .problem h3 { font-size:17px; }
.tms-svc .problem p { margin:0; font-size:15px; color:var(--text); }
.tms-svc .bridge { margin-top:28px; background:var(--navy); color:#fff; border-radius:20px; padding:clamp(24px,4vw,36px); display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px; align-items:center; }
.tms-svc .bridge .box__title { font-size:clamp(20px,2.2vw,26px); line-height:1.3; font-weight:700; color:#fff; margin:0 0 6px; }
.tms-svc .bridge p { margin:0; color:#D5DEEE; }

/* ===== What is ===== */
.tms-svc .whatis { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,5vw,64px); align-items:center; }
.tms-svc .whatis p { margin:0 0 16px; font-size:16px; color:var(--text); }
.tms-svc .whatis__list { list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.tms-svc .whatis__list li { display:flex; gap:14px; align-items:flex-start; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px 18px; }
.tms-svc .whatis__list strong { display:block; font-size:16px; }
.tms-svc .whatis__list span { font-size:14px; color:var(--text); }
.tms-svc .ico { flex:none; width:44px; height:44px; border-radius:12px; background:var(--orange-soft); display:grid; place-items:center; }

/* ===== Steps (timeline) ===== */
.tms-svc .timeline { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 24px; counter-reset:s; }
.tms-svc .timeline li { counter-increment:s; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:24px; position:relative; }
.tms-svc .timeline li::before { content:counter(s,decimal-leading-zero); display:inline-grid; place-items:center; min-width:44px; height:32px; padding:0 10px; border-radius:999px; background:var(--orange); color:#fff; font-weight:800; font-size:14px; margin-bottom:14px; }
.tms-svc .timeline p { margin:0; font-size:15px; color:var(--text); }

/* ===== Features tabs ===== */
.tms-svc .tabs { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-bottom:28px; }
.tms-svc .tabs button { font:inherit; font-size:15px; font-weight:700; color:var(--ink); background:var(--card); border:1.5px solid var(--line); border-radius:999px; padding:12px 20px; min-height:48px; cursor:pointer; }
.tms-svc .tabs button[aria-selected="true"] { background:var(--navy); color:#fff; border-color:var(--navy); }
.tms-svc .panel { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.tms-svc .panel[hidden] { display:none; }
.tms-svc .feat { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:24px; }
.tms-svc .feat .ico { margin-bottom:14px; }
.tms-svc .feat p { margin:0; font-size:15px; color:var(--text); }

/* ===== Mid CTA ===== */
.tms-svc .midcta { padding:0 0 clamp(40px,5vw,64px); }
.tms-svc .midcta.alt { background:var(--bg-alt); }
.tms-svc .midcta .box { background:var(--orange); color:#fff; border-radius:20px; padding:clamp(24px,4vw,36px); display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px; align-items:center; }
.tms-svc .midcta .box__title { margin:0 0 4px; font-size:clamp(20px,2.2vw,26px); line-height:1.3; font-weight:700; color:#fff; }
.tms-svc .midcta p { margin:0; color:#FFF3EA; }
.tms-svc .btn--white { background:#fff; color:var(--orange-dark); }
.tms-svc .btn--white:hover { background:#FFF3EA; }

/* ===== App ===== */
.tms-svc .app { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(32px,5vw,64px); align-items:center; }
.tms-svc .phone { position:relative; width:290px; max-width:100%; aspect-ratio:9/19.3; margin:0 auto; padding:11px; border-radius:52px; background:linear-gradient(145deg,#2A3A5E,#0B1A3D 45%,#1C2B4D); box-shadow:inset 0 0 0 2px #3B4C72, 0 40px 70px rgba(11,26,61,.28); }
.tms-svc .phone__key { position:absolute; width:4px; border-radius:2px; background:#1C2B4D; }
.tms-svc .phone__key--action { left:-3px; top:16%; height:26px; }
.tms-svc .phone__key--vol1 { left:-3px; top:24%; height:48px; }
.tms-svc .phone__key--vol2 { left:-3px; top:33%; height:48px; }
.tms-svc .phone__key--power { right:-3px; top:27%; height:74px; }
.tms-svc .phone__screen { position:relative; height:100%; background:#F6F8FB; border-radius:42px; overflow:hidden; color:#0B1A3D; display:flex; flex-direction:column; }
.tms-svc .phone__status { height:46px; padding:0 20px 0 28px; display:flex; align-items:center; justify-content:space-between; position:relative; flex:none; }
.tms-svc .phone__time { font-size:14px; font-weight:700; }
.tms-svc .phone__island { position:absolute; left:50%; top:10px; transform:translateX(-50%); width:74px; height:24px; border-radius:20px; background:#000; }
.tms-svc .phone__icons { display:flex; align-items:center; gap:4px; }
.tms-svc .phone__icons svg { height:10px; width:auto; }
.tms-svc .phone__appbar { flex:none; display:flex; align-items:center; gap:8px; padding:8px 18px 12px; background:#fff; border-bottom:1px solid #E6EBF3; }
.tms-svc .phone__appbar span { font-size:16px; font-weight:800; }
.tms-svc .phone__appbar em { margin-left:auto; font-style:normal; font-size:10px; font-weight:700; color:#E8731C; background:#FFF1E6; padding:3px 8px; border-radius:999px; }
.tms-svc .phone__body { flex:1; padding:14px 16px 26px; display:flex; flex-direction:column; gap:9px; }
.tms-svc .phone__trip { background:#fff; border:1px solid #E6EBF3; border-radius:12px; padding:10px 12px; display:grid; grid-template-columns:auto 1fr; gap:2px 8px; align-items:center; }
.tms-svc .phone__trip b { font-size:13px; }
.tms-svc .phone__trip span { font-size:12px; color:#3D4A63; justify-self:end; }
.tms-svc .phone__trip i { grid-column:1/-1; font-style:normal; font-size:10px; font-weight:700; color:#1B7F5A; }
.tms-svc .phone__body small { font-size:10px; font-weight:700; letter-spacing:.04em; color:#5A6780; margin-top:2px; }
.tms-svc .phone__photo { position:relative; flex:1; min-height:90px; border-radius:12px; background:#D9E1EC; display:grid; place-items:center; overflow:hidden; }
.tms-svc .phone__doc { width:72%; height:78%; background:#fff; border-radius:4px; box-shadow:0 6px 16px rgba(11,26,61,.18); transform:rotate(-4deg); padding:10px 12px; display:flex; flex-direction:column; gap:7px; }
.tms-svc .phone__doc b { font-size:9px; letter-spacing:.06em; color:#0B1A3D; }
.tms-svc .phone__doc i { display:block; height:5px; border-radius:3px; background:#E3E8F0; }
.tms-svc .phone__doc i.short { width:60%; }
.tms-svc .phone__doc u { margin-top:auto; text-decoration:none; font-size:8px; color:#5A6780; border-top:1px dashed #C9D3E6; padding-top:5px; }
.tms-svc .phone__ok { position:absolute; right:8px; bottom:8px; font-size:10px; font-weight:700; color:#1B7F5A; background:#E3F4EC; padding:4px 8px; border-radius:999px; }
.tms-svc .phone__sign { height:52px; flex:none; border-radius:12px; background:#fff; border:1px solid #DCE3EE; display:grid; place-items:center; }
.tms-svc .phone__btn { flex:none; margin-top:4px; height:44px; border-radius:12px; background:#E8731C; color:#fff; font-weight:700; font-size:14px; display:grid; place-items:center; }
.tms-svc .phone__home { position:absolute; left:50%; bottom:8px; transform:translateX(-50%); width:110px; height:5px; border-radius:3px; background:#0B1A3D; opacity:.85; }
.tms-svc .app__list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:24px; }
.tms-svc .app__list > div { display:flex; gap:12px; }
.tms-svc .app__list strong { display:block; font-size:16px; }
.tms-svc .app__list span { font-size:14px; color:var(--text); }

/* ===== Integrations ===== */
.tms-svc .integrations { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.tms-svc .integration { display:flex; align-items:center; gap:14px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:16px 18px; font-weight:700; font-size:15px; }
.tms-svc .integration .ico { width:40px; height:40px; }

/* ===== Industries ===== */
.tms-svc .industries { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.tms-svc .industry { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:22px; }
.tms-svc .industry h3 { font-size:16px; }
.tms-svc .industry p { margin:0; font-size:14px; color:var(--text); }

/* ===== Results ===== */
.tms-svc .results { background:var(--navy); color:#fff; }
.tms-svc .results h2 { color:#fff; }
.tms-svc .results .lead { color:#D5DEEE; }
.tms-svc .proof { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.tms-svc .proof__card { background:var(--navy-3); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:26px; display:flex; flex-direction:column; gap:8px; }
.tms-svc .proof__card b { font-size:34px; color:#F0802A; line-height:1.1; }
.tms-svc .proof__card strong { font-size:16px; }
.tms-svc .proof__card span { font-size:14px; color:#B6C2D8; }
.tms-svc .proof__more { margin:22px 0 0; text-align:center; }
.tms-svc .proof__more a { color:#FDBA74; font-weight:700; display:inline-block; padding:12px 4px; }

/* ===== Compare ===== */
.tms-svc .table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:16px; background:var(--card); }
.tms-svc .compare { width:100%; min-width:680px; border-collapse:collapse; font-size:15px; }
.tms-svc .compare th, .tms-svc .compare td { padding:14px 18px; text-align:left; border-top:1px solid var(--line); }
.tms-svc .compare thead th { border-top:0; background:var(--navy); color:#fff; font-size:14px; }
.tms-svc .compare thead th:last-child { background:var(--orange); }
.tms-svc .compare td:first-child { font-weight:700; }
.tms-svc .compare td:last-child { background:var(--orange-soft); font-weight:700; }
.tms-svc .swipe { display:none; margin:0 0 10px; font-size:14px; font-weight:600; color:var(--muted); }
@media (max-width:767px) {
.tms-svc .swipe { display:block; }
.tms-svc .compare td:first-child, .tms-svc .compare th:first-child { position:sticky; left:0; z-index:1; background:var(--card); box-shadow:1px 0 0 var(--line); }
.tms-svc .compare thead th:first-child { background:var(--navy); }
.tms-svc .compare td:last-child, .tms-svc .compare th:last-child { position:sticky; right:0; z-index:1; box-shadow:-1px 0 0 var(--line); }
.tms-svc .compare td:last-child { background:#FFF1E6; }
.tms-svc .compare th, .tms-svc .compare td { padding:12px 14px; font-size:14px; }
}
.tms-svc .v { display:inline-flex; align-items:center; gap:8px; }
.tms-svc .v::before { flex:none; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-size:13px; font-weight:800; }
.tms-svc .v.yes::before { content:"✓"; background:var(--green-soft); color:var(--green); }
.tms-svc .v.no::before { content:"✕"; background:var(--red-soft); color:var(--red); }
.tms-svc .v.part::before { content:"~"; background:var(--amber-soft); color:var(--amber); }

/* ===== Why ===== */
.tms-svc .why { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.tms-svc .why__item { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:24px; }
.tms-svc .why__item .ico { margin-bottom:14px; }
.tms-svc .why__item p { margin:0; font-size:15px; color:var(--text); }

/* ===== FAQ ===== */
.tms-svc .faq-cols { max-width:1120px; margin:0 auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 20px; align-items:start; }
.tms-svc .faq { display:grid; gap:12px; }
.tms-svc .faq details { background:var(--card); border:1px solid var(--line); border-radius:14px; }
.tms-svc .faq summary { list-style:none; cursor:pointer; padding:20px 56px 20px 22px; font-size:17px; font-weight:700; position:relative; }
.tms-svc .faq summary::-webkit-details-marker { display:none; }
.tms-svc .faq summary h3 { margin:0; font:inherit; color:inherit; letter-spacing:inherit; }
.tms-svc .faq summary::after { content:"+"; position:absolute; right:22px; top:50%; transform:translateY(-50%); font-size:24px; font-weight:600; color:var(--orange); }
.tms-svc .faq details[open] summary::after { content:"–"; }
.tms-svc .faq details p { margin:0; padding:0 22px 20px; font-size:15px; color:var(--text); }


/* ===== Solutions ===== */
.tms-svc .solutions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.tms-svc .solution { position:relative; display:flex; flex-direction:column; gap:6px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:24px; text-decoration:none; color:var(--ink); transition:border-color .2s ease, box-shadow .2s ease; }
.tms-svc .solution:hover { border-color:var(--orange); box-shadow:0 12px 30px rgba(11,26,61,.08); }
.tms-svc .solution h3 a { color:inherit; text-decoration:none; }
.tms-svc .solution h3 a::after { content:""; position:absolute; inset:0; border-radius:16px; }
.tms-svc .solution:focus-within { border-color:var(--orange); }
.tms-svc .solution p { margin:0 0 6px; font-size:15px; color:var(--text); }
.tms-svc .solution span { margin-top:auto; font-weight:700; font-size:15px; color:var(--orange-dark); }
.tms-svc .solution span::after { content:" →"; }
/* ===== Benefits ===== */
.tms-svc .benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 32px; }
.tms-svc .benefit { display:flex; gap:14px; align-items:flex-start; }
.tms-svc .benefit h3 { font-size:17px; margin-bottom:4px; }
.tms-svc .benefit p { margin:0; font-size:15px; color:var(--text); }
.tms-svc .tabs button { background:var(--bg-alt); }

/* ===== Conversion ===== */
.tms-svc .hero .hero__note { margin:14px 0 0; font-size:14px; color:#B9C6DD; }
.tms-svc .box__ctas { display:flex; gap:12px; flex-wrap:wrap; }
.tms-svc .sticky-cta { display:none; }
@media (max-width:767px) {
.tms-svc .box__ctas .btn { width:100%; }
.tms-svc .sticky-cta { display:flex; transform:translateY(120%); transition:transform .25s ease; gap:10px; position:fixed; left:0; right:0; bottom:0; z-index:50; padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px)); background:var(--bg); border-top:1px solid var(--line); box-shadow:0 -6px 20px rgba(11,26,61,.12); }
.tms-svc .sticky-cta.is-visible { transform:none; }
.tms-svc .sticky-cta .btn { min-height:48px; }
.tms-svc .sticky-cta .btn--primary { flex:1; }
.tms-svc .sticky-cta__call { border:1.5px solid var(--orange); color:var(--orange-dark); padding:0 18px; }
.tms-svc body { padding-bottom:76px; }
}


/* ===== Hover highlight on cards (mouse / trackpad only) ===== */
.tms-svc .problem, .tms-svc .whatis__list li, .tms-svc .timeline li, .tms-svc .feat, .tms-svc .solution, .tms-svc .industry, .tms-svc .why__item, .tms-svc .integration, .tms-svc .faq details, .tms-svc .proof__card, .tms-svc .phone__trip {
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease, background-color .2s ease;
}
@media (hover:hover) {
  .problem:hover, .whatis__list li:hover, .timeline li:hover, .feat:hover, .solution:hover,
.tms-svc .industry:hover, .tms-svc .why__item:hover, .tms-svc .integration:hover, .tms-svc .faq details:hover {
    border-color: var(--orange);
    box-shadow: 0 12px 30px rgba(11,26,61,.10);
    transform: translateY(-3px);
  }
.tms-svc .problem:hover { border-top-color: var(--red); }
.tms-svc .faq details:hover { transform:none; }
.tms-svc .proof__card:hover { border-color: rgba(240,128,42,.6); background: #18295A; transform: translateY(-3px); }
.tms-svc .benefit { border-radius:12px; padding:10px; margin:-10px; transition: background-color .2s ease; }
.tms-svc .benefit:hover { background: var(--card); box-shadow: 0 8px 22px rgba(11,26,61,.08); }
.tms-svc .compare tbody tr { transition: background-color .15s ease; }
.tms-svc .compare tbody tr:hover td { background: var(--bg-alt); }
.tms-svc .compare tbody tr:hover td:last-child { background: #FFE4CC; }
}

/* ===== Responsive ===== */
@media (max-width:1024px) {
.tms-svc .hero .wrap, .tms-svc .whatis, .tms-svc .app { grid-template-columns:1fr; }
.tms-svc .problems, .tms-svc .panel, .tms-svc .timeline, .tms-svc .why, .tms-svc .proof, .tms-svc .solutions, .tms-svc .benefits { grid-template-columns:repeat(2,minmax(0,1fr)); }
.tms-svc .industries { grid-template-columns:repeat(2,minmax(0,1fr)); }
.tms-svc .integrations { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
/* FAQ: every closed card the same height, text centred, so both columns line up */
@media (min-width:901px) {
.tms-svc .faq-cols .faq summary { box-sizing:border-box; display:flex; align-items:center; min-height:82px; padding-top:14px; padding-bottom:14px; font-size:16px; line-height:1.4; }
}
@media (max-width:900px) { .tms-svc .faq-cols { grid-template-columns:1fr; } }
@media (max-width:767px) {
.tms-svc .problems, .tms-svc .panel, .tms-svc .timeline, .tms-svc .why, .tms-svc .proof, .tms-svc .industries, .tms-svc .integrations, .tms-svc .app__list, .tms-svc .solutions, .tms-svc .benefits { grid-template-columns:1fr; }
.tms-svc .bridge, .tms-svc .midcta .box { grid-template-columns:1fr; }
.tms-svc .bridge .btn, .tms-svc .midcta .btn, .tms-svc .hero__ctas .btn { width:100%; }
.tms-svc .mock__body { grid-template-columns:1fr; }
.tms-svc .mock__nav { display:none; }
.tms-svc .tabs { flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; margin:0 calc(-1 * clamp(20px,5vw,40px)) 24px; padding:0 clamp(20px,5vw,40px) 4px; scrollbar-width:none; }
.tms-svc .tabs::-webkit-scrollbar { display:none; }
.tms-svc .tabs button { flex:none; }
}


/* ===== Bigger dashboard preview on desktop ===== */
@media (min-width:1025px) {
.tms-svc .hero .wrap { max-width:1320px; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:56px; }
.tms-svc .mock__bar { height:40px; }
.tms-svc .mock__bar span { font-size:13px; }
.tms-svc .mock__body { grid-template-columns:160px minmax(0,1fr); }
.tms-svc .mock__nav { padding:20px 12px; gap:6px; }
.tms-svc .mock__nav b { font-size:16px; }
.tms-svc .mock__nav span { font-size:14px; padding:9px 10px; }
.tms-svc .mock__main { padding:22px; gap:16px; }
.tms-svc .mock__row strong { font-size:19px; }
.tms-svc .mock__row em { font-size:13px; padding:8px 12px; }
.tms-svc .mock__tiles { gap:12px; }
.tms-svc .mock__tiles div { padding:14px; }
.tms-svc .mock__tiles small { font-size:12px; }
.tms-svc .mock__tiles b { font-size:24px; }
.tms-svc .mock table { font-size:14px; }
.tms-svc .mock th { font-size:12px; padding:10px 14px; }
.tms-svc .mock td { padding:11px 14px; }
.tms-svc .pill { font-size:12px; padding:4px 10px; }
}

/* Dashboard preview on smaller laptops (1025–1279px): tighter so nothing is cut off */
@media (min-width:1025px) and (max-width:1279px) {
.tms-svc .hero .wrap { grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:40px; }
.tms-svc .mock__body { grid-template-columns:124px minmax(0,1fr); }
.tms-svc .mock__nav { padding:16px 10px; gap:4px; }
.tms-svc .mock__nav b { font-size:15px; }
.tms-svc .mock__nav span { font-size:13px; padding:8px 9px; }
.tms-svc .mock__main { padding:16px; gap:12px; }
.tms-svc .mock__row strong { font-size:17px; }
.tms-svc .mock__row em { font-size:12px; padding:7px 10px; }
.tms-svc .mock__tiles { gap:8px; }
.tms-svc .mock__tiles div { padding:10px 12px; }
.tms-svc .mock__tiles small { font-size:11px; }
.tms-svc .mock__tiles b { font-size:21px; }
.tms-svc .mock table { font-size:12.5px; }
.tms-svc .mock th { font-size:11px; padding:9px 10px; }
.tms-svc .mock td { padding:9px 10px; }
.tms-svc .pill { font-size:11px; padding:3px 8px; }
}
.tms-svc .mock__main { min-width:0; overflow:hidden; }
.tms-svc .mock__tiles small { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tms-svc .mock td:last-child, .tms-svc .mock th:last-child { text-align:right; }

/* ===== Mobile readability ===== */
@media (max-width:767px) {
.tms-svc section { padding:40px 0; }
.tms-svc .midcta { padding:0 0 40px; }
.tms-svc .hero h1 { font-size:clamp(28px,8.2vw,34px); }
.tms-svc .hero__points { gap:8px; font-size:13px; }
.tms-svc .hero__points li { padding:9px 10px; gap:6px; white-space:normal; line-height:1.25; border-radius:12px; }
.tms-svc .tag { font-size:12px; padding:7px 12px; gap:7px; letter-spacing:-0.01em; }
.tms-svc .head { margin-bottom:22px; }
.tms-svc h2 { font-size:26px; }
.tms-svc .lead { font-size:15px; }
  /* feature tabs: 2 x 2 grid, all groups visible */
.tms-svc .tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; overflow:visible; margin:0 0 18px; padding:0; }
.tms-svc .tabs button { padding:10px 8px; font-size:13px; line-height:1.25; min-height:48px; white-space:normal; }
  /* compact cards: icon beside text */
.tms-svc .feat, .tms-svc .why__item { display:grid; grid-template-columns:40px minmax(0,1fr); column-gap:14px; padding:16px; }
.tms-svc .feat .ico, .tms-svc .why__item .ico { grid-row:span 2; width:40px; height:40px; margin:0; }
.tms-svc .feat h3, .tms-svc .why__item h3 { font-size:16px; margin-bottom:4px; }
.tms-svc .feat p, .tms-svc .why__item p { font-size:14px; }
.tms-svc .problem, .tms-svc .solution, .tms-svc .industry { padding:16px 18px; }
.tms-svc .problem p, .tms-svc .solution p, .tms-svc .industry p { font-size:14px; }
.tms-svc .problems, .tms-svc .panel, .tms-svc .why, .tms-svc .solutions, .tms-svc .industries, .tms-svc .proof { gap:12px; }
  /* how-it-works: number beside title */
.tms-svc .timeline { gap:12px; }
.tms-svc .timeline li { padding:16px 18px 16px 70px; }
.tms-svc .timeline li::before { position:absolute; left:16px; top:16px; min-width:40px; height:28px; font-size:13px; margin:0; }
.tms-svc .timeline p { font-size:14px; }
.tms-svc .proof__card { padding:18px; }
.tms-svc .proof__card b { font-size:28px; }
.tms-svc .integrations { grid-template-columns:1fr 1fr; gap:10px; }
.tms-svc .integration { padding:12px; font-size:13px; gap:10px; }
.tms-svc .integration .ico { width:32px; height:32px; }
  /* app section: text first, smaller phone */
.tms-svc .app > div:last-child { order:-1; }
.tms-svc .phone { width:250px; }
.tms-svc .app__list { gap:12px; }
}

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none !important; } }

/* Site shell fixes — appended after scoped export CSS by integrate-tms-service-export.py */

.tms-svc .mock__table-scroll {
  overflow: hidden;
  max-width: 100%;
  min-width: 0;
}

.tms-svc .mock__table-scroll table {
  table-layout: fixed;
  width: 100%;
}

.tms-svc .mock__table-scroll th:nth-child(1),
.tms-svc .mock__table-scroll td:nth-child(1) {
  width: 26%;
}

.tms-svc .mock__table-scroll th:nth-child(2),
.tms-svc .mock__table-scroll td:nth-child(2) {
  width: 44%;
}

.tms-svc .mock__table-scroll th:nth-child(3),
.tms-svc .mock__table-scroll td:nth-child(3) {
  width: 30%;
}

.tms-svc .mock__table-scroll td {
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.25;
  vertical-align: middle;
}

.tms-svc .mock__table-scroll td:first-child {
  white-space: nowrap;
}

.tms-svc .mock__table-scroll .pill {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}

.tms-svc .mock__row {
  gap: 8px;
  min-width: 0;
}

.tms-svc .mock__row strong {
  min-width: 0;
  flex: 1 1 auto;
}

.tms-svc .mock__row em {
  flex: 0 0 auto;
  font-size: 10px;
  padding: 5px 8px;
  white-space: nowrap;
}

.tms-svc .swipe {
  display: none !important;
}

.tms-svc .table-wrap {
  overflow-x: visible;
}

@media (max-width: 1024px) {
  .tms-svc .tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    overflow: visible;
    margin: 0 0 24px;
    padding: 0;
  }
  .tms-svc .tabs button {
    width: 100%;
    white-space: normal;
    text-align: center;
    line-height: 1.3;
    font-size: 12px;
    padding: 12px 10px;
    min-height: 48px;
  }
}

@media (max-width: 767px) {
  .tms-svc .table-wrap {
    overflow: visible;
    border: 0;
    background: transparent;
    border-radius: 0;
  }
  .tms-svc .compare {
    min-width: 0;
    display: block;
  }
  .tms-svc .compare thead {
    display: none;
  }
  .tms-svc .compare tbody {
    display: grid;
    gap: 12px;
  }
  .tms-svc .compare tbody tr {
    display: block;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
  }
  .tms-svc .compare td {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-top: 1px solid var(--line);
    position: static;
    max-width: none;
    min-width: 0;
    background: transparent !important;
    font-weight: 400;
    box-shadow: none !important;
  }
  .tms-svc .compare td:first-child {
    display: block;
    background: var(--navy) !important;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    border-top: 0;
    padding: 12px 14px;
  }
  .tms-svc .compare td:nth-child(2)::before,
  .tms-svc .compare td:nth-child(3)::before,
  .tms-svc .compare td:nth-child(4)::before {
    flex: 0 0 38%;
    font-size: 12px;
    font-weight: 700;
    color: var(--muted);
    line-height: 1.35;
  }
  .tms-svc .compare td:nth-child(2)::before {
    content: "Excel / Manual";
  }
  .tms-svc .compare td:nth-child(3)::before {
    content: "Basic TMS";
  }
  .tms-svc .compare td:nth-child(4)::before {
    content: "LogiBrisk TMS";
    color: var(--orange-dark);
  }
  .tms-svc .compare td:nth-child(4) {
    background: var(--orange-soft) !important;
    font-weight: 700;
  }
  .tms-svc .compare .v {
    font-size: 12px;
    text-align: right;
  }
}

/* ===== Embedded site overrides (globals.css / navbar conflicts) ===== */
.tms-svc {
  color-scheme: light;
}
.tms-svc h1,
.tms-svc h2,
.tms-svc h3,
.tms-svc h4,
.tms-svc h5,
.tms-svc h6 {
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
.tms-svc .hero h1 {
  color: #fff !important;
  font-size: clamp(32px, 3.7vw, 50px) !important;
  line-height: 1.08 !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  text-wrap: balance;
}
.tms-svc .hero h1 .h1-top {
  display: block;
  color: #fff !important;
}
.tms-svc .hero h1 .h1-hl {
  color: #f0802a !important;
}
.tms-svc .hero h1 span:not(.h1-top) {
  color: #f0802a !important;
}
.tms-svc .hero p {
  color: #d5deee !important;
  font-size: clamp(16px, 1.4vw, 18px) !important;
  line-height: 1.55 !important;
}
.tms-svc .hero .btn {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif !important;
  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 12px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
.tms-svc .hero .btn--primary {
  background: var(--orange) !important;
  border: 1.5px solid var(--orange) !important;
  color: #fff !important;
}
.tms-svc .hero .btn--primary:hover {
  background: var(--orange-dark) !important;
  border-color: var(--orange-dark) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.tms-svc .hero .btn--ghost {
  background: transparent !important;
  border: 1.5px solid #fff !important;
  color: #fff !important;
}
.tms-svc .hero .btn--ghost:hover {
  border-color: #fff !important;
  color: #fff !important;
  background: transparent !important;
  box-shadow: none !important;
}
.tms-svc .hero {
  padding-block: clamp(36px, 4.5vw, 56px) !important;
}
.tms-svc .hero h1 {
  margin: 12px 0 12px !important;
  font-size: clamp(30px, 3.2vw, 46px) !important;
}
.tms-svc .hero p {
  margin-bottom: 20px !important;
}
.tms-svc .hero__points {
  margin-top: 18px !important;
}
.tms-svc .hero .btn {
  min-height: 48px !important;
  padding: 0 22px !important;
}
.tms-svc .hero .wrap {
  max-width: 1340px;
  padding-inline: clamp(28px, 5.5vw, 72px);
  align-items: center;
}
@media (min-width: 1025px) {
  .tms-svc .hero .mock__body {
    min-height: 288px;
  }
  .tms-svc .hero .wrap {
    gap: clamp(40px, 6vw, 88px);
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
  }
  .tms-svc .hero .wrap > div:first-child {
    justify-self: start;
    width: 100%;
    max-width: 600px;
    margin-inline-end: auto;
  }
  .tms-svc .hero .wrap > .mock {
    justify-self: end;
    width: 100%;
    max-width: 548px;
    margin-inline-start: auto;
  }
}
@media (max-width: 1024px) {
  .tms-svc .hero {
    overflow: visible !important;
  }
  .tms-svc .hero .wrap {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding-inline: clamp(20px, 5vw, 32px) !important;
  }
  .tms-svc .hero .wrap > div:first-child {
    order: 1;
    max-width: none !important;
    margin-inline: 0 !important;
    justify-self: stretch !important;
  }
  .tms-svc .hero .wrap > .mock {
    order: 2;
    max-width: 100% !important;
    width: 100% !important;
    margin-inline: 0 !important;
    justify-self: stretch !important;
  }
  .tms-svc .hero .mock__body {
    min-height: 0 !important;
  }
}

/* Hero trips preview: main panel only — full tile/status labels (no cramped sidebar) */
.tms-svc .hero .mock__body {
  grid-template-columns: 1fr !important;
}
.tms-svc .hero .mock__nav {
  display: none !important;
}
.tms-svc .hero .mock__tiles small {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}
.tms-svc .hero .mock__table-scroll .pill {
  max-width: none;
  overflow: visible;
  text-overflow: clip;
}

@media (max-width: 767px) {
  .tms-svc .hero h1 {
    font-size: clamp(26px, 6.8vw, 34px) !important;
    line-height: 1.12 !important;
  }
  .tms-svc .hero p {
    max-width: none !important;
  }
  .tms-svc .hero__ctas {
    flex-direction: column;
    align-items: stretch;
  }
  .tms-svc .hero__ctas .btn {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow: visible !important;
  }
}
.tms-svc .btn {
  font-family: "Plus Jakarta Sans", system-ui, sans-serif !important;
  box-shadow: none !important;
}
.tms-svc .btn--primary {
  background: var(--orange) !important;
  border-color: var(--orange) !important;
  color: #fff !important;
}
.tms-svc .btn--primary:hover {
  background: var(--orange-dark) !important;
  border-color: var(--orange-dark) !important;
  box-shadow: none !important;
}
.tms-svc .btn--ghost {
  background: transparent !important;
  color: #fff !important;
}
.tms-svc .btn--white {
  background: #fff !important;
  color: var(--orange-dark) !important;
  border-color: #fff !important;
}
.tms-svc section:not(.hero):not(.results):not(.cta) h2 {
  color: var(--ink) !important;
}
.tms-svc section:not(.hero):not(.results):not(.cta) p {
  color: inherit;
}
.tms-svc .midcta .box {
  background: var(--orange) !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
}
.tms-svc .midcta .box__title {
  color: #fff !important;
  font-weight: 800 !important;
}
.tms-svc .midcta p {
  color: #fff3ea !important;
}
.tms-svc .midcta .btn--white {
  background: #fff !important;
  color: var(--orange-dark) !important;
  border: 1.5px solid #fff !important;
  white-space: nowrap;
  font-weight: 700 !important;
  box-shadow: none !important;
}
.tms-svc .midcta .btn--white:hover {
  background: #fff3ea !important;
  color: var(--orange-dark) !important;
}
@media (min-width: 768px) {
  .tms-svc .midcta .btn {
    width: auto !important;
  }
}
@media (max-width: 767px) {
  .tms-svc .midcta .box {
    grid-template-columns: 1fr !important;
  }
}

/* Final CTA band (not in SEO export — match standalone design) */
.tms-svc .cta {
  background: var(--navy) !important;
  color: #fff !important;
  text-align: center;
  padding: clamp(48px, 6vw, 72px) 0;
}
.tms-svc .cta h2 {
  color: #fff !important;
  margin: 0 0 12px !important;
  font-size: clamp(28px, 3.2vw, 36px) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
}
.tms-svc .cta .lead {
  color: #d5deee !important;
  margin: 0 auto 28px !important;
  max-width: 640px;
  font-size: clamp(16px, 1.4vw, 18px);
  line-height: 1.55;
}
.tms-svc .cta__row {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
}
.tms-svc .cta .btn {
  min-height: 52px !important;
  padding: 0 26px !important;
  border-radius: 12px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
@media (max-width: 767px) {
  .tms-svc .cta__row {
    flex-direction: column;
    align-items: stretch;
  }
  .tms-svc .cta__row .btn {
    width: 100% !important;
  }
}

.tms-svc .cta .btn--ghost {
  background: transparent !important;
  border: 1.5px solid rgba(255, 255, 255, 0.45) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.tms-svc .cta .btn--ghost:hover {
  border-color: #fff !important;
  color: #fff !important;
  background: transparent !important;
}
.tms-svc .cta .btn--primary {
  background: var(--orange) !important;
  border: 1.5px solid var(--orange) !important;
  color: #fff !important;
}
.tms-svc .cta .btn--primary:hover {
  background: var(--orange-dark) !important;
  border-color: var(--orange-dark) !important;
  color: #fff !important;
}