/* Trident LMS 1.7.42 · learning paths showcase (.tpths): home section «Percursos de carreira», [trident_paths], archive page,
   catalogue line. Theme colours: navy #252652, teal #17a5bc / #0d6c8c, gold #f5b81c; Inter (theme font). Mobile first.
   The site has no dark theme, so every colour is set explicitly (an OS dark mode does not change this section). */
.tpths { --n: #252652; --t: #17a5bc; --td: #0d6c8c; --g: #f5b81c; --mut: #4f5672; --line: #dfe6ee; --soft: #f4f8fb;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; color: var(--n); line-height: 1.5; box-sizing: border-box; }
.tpths *, .tpths *::before, .tpths *::after { box-sizing: border-box; }
.tpths h2, .tpths h3, .tpths p { margin: 0; }
.tpc-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* home section */
.tpths--home { background: var(--soft); padding: 56px 16px; width: 100%; }
.tpths__in { max-width: 1200px; margin: 0 auto; }
.tpths__head { text-align: center; max-width: 760px; margin: 0 auto 32px; }
.tpths__head h2 { font-size: clamp(28px, 4.6vw, 42px); line-height: 1.15; font-weight: 800; letter-spacing: -.02em; color: var(--n); }
.tpths__head h2::after { content: ""; display: block; width: 64px; height: 4px; border-radius: 2px; margin: 14px auto 0; background: linear-gradient(90deg, var(--t), var(--g)); }
.tpths__sub { margin-top: 14px; font-size: 18px; color: var(--mut); }
.tpths__all { text-align: center; margin-top: 28px; }
.tpths__more { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 10px 22px; border-radius: 12px; border: 2px solid var(--td);
  color: var(--td) !important; font-weight: 700; text-decoration: none; background: #fff; }
.tpths__more:hover { background: var(--td); color: #fff !important; }

/* grid: 1 / 2 / 3 columns */
.tpths__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .tpths__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .tpths__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } }
.tpc-li { display: flex; min-width: 0; }

/* carousel: native horizontal scroll with snap (no script, no layout shift) */
.tpths__scroller { overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; -webkit-overflow-scrolling: touch; }
.tpths__scroller:focus-visible { outline: 3px solid var(--td); outline-offset: 4px; }
.tpths__grid--carousel { grid-template-columns: none !important; grid-auto-flow: column; grid-auto-columns: 86%; }
@media (min-width: 640px) { .tpths__grid--carousel { grid-auto-columns: calc(50% - 10px); } }
@media (min-width: 1024px) { .tpths__grid--carousel { grid-auto-columns: calc(33.333% - 16px); } }
.tpths__grid--carousel > li { scroll-snap-align: start; }

/* card */
.tpc { display: flex; flex-direction: column; width: 100%; background: #fff; border: 1px solid var(--line); border-radius: 16px; overflow: hidden;
  box-shadow: 0 10px 28px -18px rgba(37, 38, 82, .35); transition: transform .15s, box-shadow .15s; }
.tpc:hover { transform: translateY(-3px); box-shadow: 0 18px 36px -18px rgba(37, 38, 82, .45); }
.tpc__media { position: relative; aspect-ratio: 16 / 9; background: linear-gradient(135deg, var(--n) 0%, #1b4f72 60%, var(--td) 100%); display: flex; align-items: center; justify-content: center; }
.tpc__media > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tpc__ico { font-size: 52px; line-height: 1; filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .25)); }
.tpc__ico img.emoji { width: 1em !important; height: 1em !important; margin: 0 !important; }   /* WordPress turns emoji into <img class="emoji"> */
.tpc__ico--badge { position: absolute; left: 12px; top: 12px; width: 48px; height: 48px; border-radius: 50%; background: #fff; display: flex; align-items: center;
  justify-content: center; font-size: 26px; box-shadow: 0 6px 14px rgba(0, 0, 0, .18); filter: none; }
.tpc__body { display: flex; flex-direction: column; gap: 8px; padding: 18px 18px 20px; flex: 1; }
.tpc__area { font-size: 12.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--td); }
.tpc__title { font-size: 19px; line-height: 1.3; font-weight: 800; color: var(--n); }
.tpc__desc { font-size: 15px; color: var(--mut); display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tpc__meta { font-size: 14px; font-weight: 600; color: var(--n); }
.tpc__cert { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; font-size: 13px; font-weight: 700; color: #6b4a00;
  background: #fff4d1; border: 1px solid #f1d27a; border-radius: 999px; padding: 4px 10px; }
.tpc__tags .tcat-std, .tpths .tcat-std { display: flex; flex-wrap: wrap; gap: 6px; }
.tpths .tcat-std i { font-style: normal; font-size: 12.5px; font-weight: 600; color: #0d6c8c; background: #e1f6f7; border: 1px solid #bbebf0; border-radius: 6px; padding: 3px 8px; }
.tpths .tcat-std i.tcat-law { color: #6b4a00; background: #fff3c4; border-color: #f2d675; }
.tpc__price { margin-top: auto !important; padding-top: 10px; border-top: 1px dashed var(--line); display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.tpc__was s { color: var(--mut); font-size: 15px; }
.tpc__now b { font-size: 21px; font-weight: 800; color: var(--n); }
.tpc__now small, .tpc__from { font-size: 13px; color: var(--mut); }
.tpc__save { font-size: 13px; font-weight: 800; color: var(--n); background: var(--g); border-radius: 999px; padding: 3px 10px; }
.tpc__owned { font-weight: 700; color: #13795b; }
.tpc__btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 46px; margin-top: 6px; padding: 11px 20px; border-radius: 12px;
  background: var(--td); color: #fff !important; font-weight: 700; font-size: 15.5px; text-decoration: none; }
.tpc__btn:hover { background: #085170; }
.tpc__btn:focus-visible, .tpths__more:focus-visible, .tpths__filter a:focus-visible, .tpths-line a:focus-visible { outline: 3px solid var(--n); outline-offset: 3px; box-shadow: 0 0 0 6px var(--g); }

/* archive */
.tpths--archive { padding: 8px 0 24px; }
.tpths__lead { font-size: 18px; color: var(--mut); max-width: 70ch; margin-bottom: 20px !important; }
.tpths__filter ul { list-style: none; margin: 0 0 28px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.tpths__filter a { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 7px 14px; border-radius: 999px; border: 1.5px solid var(--line);
  background: #fff; color: var(--n) !important; font-weight: 600; font-size: 14.5px; text-decoration: none; }
.tpths__filter a span { font-size: 12px; color: var(--mut); }
.tpths__filter a[aria-current="true"] { background: var(--n); border-color: var(--n); color: #fff !important; }
.tpths__filter a[aria-current="true"] span { color: #d6dbf0; }
.tpths__group { margin-bottom: 36px; }
.tpths__group[hidden] { display: none; }
.tpths__group h2 { font-size: clamp(22px, 3vw, 28px); font-weight: 800; color: var(--n); margin-bottom: 16px !important; }
.tpths__count { font-size: 14px; font-weight: 600; color: var(--mut); margin-left: 6px; }
.tpths__empty { font-size: 17px; color: var(--mut); }

/* catalogue line */
.tpths-line { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; justify-content: space-between; max-width: 1140px; margin: 14px auto; padding: 10px 16px;
  border-radius: 12px; background: #fff9e8; border: 1px solid #f3dfa4; border-left: 4px solid #f5b81c; color: #252652; font: 500 15px/1.45 Inter, Arial, sans-serif; box-sizing: border-box; }
.tpths-line a { background: #0d6c8c; color: #fff !important; border-radius: 999px; padding: 6px 16px; font-weight: 700; font-size: 14px; text-decoration: none; white-space: nowrap; }

@media (prefers-reduced-motion: reduce) { .tpc, .tpc:hover { transition: none; transform: none; } }
@media (forced-colors: active) { .tpc, .tpths__filter a, .tpths__more { border: 1px solid CanvasText; } .tpc__save, .tpc__cert { border: 1px solid CanvasText; } }
