/*
 * Trademinator Joomla 6 skin, based on the live portal's Instrument Sans
 * and gray-50 / gray-950 / slate-900 palette. Bootstrap 5.3 supplies layout.
 */
:root, [data-bs-theme="light"] {
  color-scheme: light;
  --tr-bg: #f9fafb; --tr-surface: #fff; --tr-surface-soft: #f3f4f6;
  --tr-ink: #111827; --tr-muted: #6b7280;
  --tr-border: #e5e7eb; --tr-border-strong: #d1d5db;
  --tr-primary: #111827; --tr-primary-hover: #374151; --tr-primary-ink: #fff;
  --tr-focus: #233248; --tr-shadow: 0 12px 34px rgba(17,24,39,.055);
  --tr-radius: 12px;
  --bs-body-bg: var(--tr-bg); --bs-body-color: var(--tr-ink);
  --bs-body-font-family: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bs-border-color: var(--tr-border);
  --bs-link-color: #075baf; --bs-link-hover-color: #06447e;
  --bs-primary: #233248; --bs-primary-rgb: 35,50,72;
}
[data-bs-theme="dark"] {
  color-scheme: dark;
  --tr-bg: #030712; --tr-surface: #111827; --tr-surface-soft: #1f2937;
  --tr-ink: #f3f4f6; --tr-muted: #9ca3af;
  --tr-border: #273244; --tr-border-strong: #374151;
  --tr-primary: #f3f4f6; --tr-primary-hover: #fff; --tr-primary-ink: #030712;
  --tr-focus: #e6a21c; --tr-shadow: 0 16px 42px rgba(0,0,0,.2);
  --bs-body-bg: var(--tr-bg); --bs-body-color: var(--tr-ink);
  --bs-border-color: var(--tr-border);
  --bs-link-color: #9ac9ff; --bs-link-hover-color: #c2defe;
  --bs-primary: #233248; --bs-primary-rgb: 35,50,72;
}
html { scroll-behavior: smooth; }
body.tr-site {
  min-width: 320px; min-height: 100vh; display: flex; flex-direction: column;
  margin: 0; background: var(--tr-bg); color: var(--tr-ink);
  font-family: var(--bs-body-font-family); font-size: 1rem; line-height: 1.6;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
body.tr-site h1, body.tr-site h2, body.tr-site h3, body.tr-site h4,
body.tr-site h5, body.tr-site h6 {
  color: var(--tr-ink); font-weight: 600; letter-spacing: -.025em;
}
body.tr-site a:not(.btn):not(.navbar-brand):not(.dropdown-item) { text-underline-offset: .18em; }
body.tr-site a:focus-visible, body.tr-site button:focus-visible,
body.tr-site input:focus-visible, body.tr-site select:focus-visible,
body.tr-site textarea:focus-visible {
  outline: 3px solid var(--tr-focus); outline-offset: 3px; box-shadow: none;
}
.tr-skip-link {
  position: fixed; z-index: 2000; top: 1rem; left: 1rem;
  padding: .6rem 1rem; color: var(--tr-primary-ink);
  background: var(--tr-primary); border-radius: .5rem;
  box-shadow: var(--tr-shadow); text-decoration: none;
}
/* Bootstrap's visually-hidden-focusable conceals this link until focused.
   Keep the focus treatment obvious without disrupting the header layout. */
.tr-skip-link:focus { color: var(--tr-primary-ink); text-decoration: none; }
.tr-topbar {
  background: var(--tr-surface-soft); border-bottom: 1px solid var(--tr-border);
  font-size: .875rem; padding: .5rem 0;
}
.tr-topbar p { margin-bottom: 0; }
.tr-header { position: relative; z-index: 1025; background: var(--tr-bg); border-bottom: 1px solid transparent; }
.tr-site--inner .tr-header, .tr-header:has(.show) { border-bottom-color: var(--tr-border); }
.tr-navbar { min-height: 88px; padding: .85rem 0; gap: 1rem; }
.tr-brand {
  display: inline-flex; align-items: center; gap: .65rem;
  flex: 0 1 auto; min-width: 0;
  margin: 0; padding: 0; color: var(--tr-ink) !important; font-size: 1rem;
  font-weight: 600; letter-spacing: -.025em; text-decoration: none;
}
.tr-brand:hover { opacity: .88; }
.tr-brand-icon { display: block; flex-shrink: 0; max-width: 44px; height: auto; object-fit: contain; }
.tr-brand span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr-navigation { justify-content: flex-end; gap: 1rem; }
.tr-navigation > div { min-width: 0; }
.tr-navigation ul.mod-menu, .tr-navigation ul.mod-list {
  display: flex; align-items: center; flex-wrap: wrap; gap: .15rem;
  padding: 0; margin: 0; list-style: none;
}
.tr-navigation .mod-menu li, .tr-navigation .mod-list li { position: relative; list-style: none; }
.tr-navigation .mod-menu > li > a, .tr-navigation .mod-menu > li > span,
.tr-navigation .mod-list > li > a {
  display: block; padding: .55rem .85rem; color: var(--tr-ink);
  border-radius: .4rem; font-size: .925rem; font-weight: 500;
  text-decoration: none; transition: background-color .18s ease;
}
.tr-navigation .mod-menu a:hover, .tr-navigation .mod-menu a:focus,
.tr-navigation .mod-list a:hover, .tr-navigation .current > a,
.tr-navigation .active > a { background: var(--tr-surface-soft); color: var(--tr-ink); }
.tr-navigation .mod-menu .mod-menu__sub, .tr-navigation .mod-menu ul ul {
  display: none; position: absolute; top: 100%; inset-inline-start: 0;
  min-width: 210px; z-index: 10; padding: .4rem; list-style: none;
  border: 1px solid var(--tr-border); border-radius: .6rem;
  background: var(--tr-surface); box-shadow: var(--tr-shadow);
}
.tr-navigation .mod-menu li:hover > ul, .tr-navigation .mod-menu li:focus-within > ul { display: block; }
.tr-navigation .mod-menu ul ul a {
  display: block; padding: .55rem .7rem; color: var(--tr-ink);
  text-decoration: none; border-radius: .4rem;
}
.tr-header-actions { display: flex; align-items: center; gap: .5rem; }
.tr-header-actions p { margin-bottom: 0; }
.tr-mobile-toggle {
  padding: .55rem; border: 1px solid var(--tr-border-strong);
  border-radius: .5rem; box-shadow: none !important;
}
.tr-theme-control { flex-shrink: 0; }
.tr-theme-trigger {
  display: grid; place-items: center; width: 40px; height: 40px; padding: 0;
  border: 1px solid var(--tr-border-strong); color: var(--tr-ink);
  background: transparent; border-radius: .5rem;
}
.tr-theme-trigger:hover, .tr-theme-trigger.show { color: var(--tr-ink); background: var(--tr-surface-soft); }
.tr-theme-trigger svg { grid-area: 1 / 1; }
.tr-theme-moon { display: none; }
[data-bs-theme="dark"] .tr-theme-sun { display: none; }
[data-bs-theme="dark"] .tr-theme-moon { display: block; }
.tr-theme-menu {
  min-width: 170px; padding: .35rem; border: 1px solid var(--tr-border);
  border-radius: .65rem; background: var(--tr-surface); box-shadow: var(--tr-shadow);
}
.tr-theme-menu .dropdown-item {
  color: var(--tr-ink); padding: .5rem .65rem; font-size: .9rem; border-radius: .4rem;
}
.tr-theme-menu .dropdown-item:hover, .tr-theme-menu .dropdown-item.active {
  background: var(--tr-surface-soft); color: var(--tr-ink);
}
.tr-theme-menu .dropdown-item.active::after { content: "✓"; float: right; }
/* Live portal-inspired two-column hero. */
.tr-hero { padding: clamp(4rem,8vw,8rem) 0 clamp(4.75rem,9vw,8rem); }
.tr-hero-visual { display: flex; align-items: center; justify-content: center; min-width: 0; }
.tr-hero-visual img, .tr-hero-visual picture, .tr-hero-visual video {
  display: block; max-width: 100%; height: auto;
}
.tr-hero-logo { display: block; width: 100%; max-width: 460px; height: auto; object-fit: contain; }
.tr-hero-copy { max-width: 620px; min-width: 0; overflow-wrap: break-word; }
.tr-eyebrow {
  margin-bottom: 1.1rem; color: var(--tr-muted); font-size: .8rem;
  font-weight: 600; line-height: 1.5; letter-spacing: .11em; text-transform: uppercase;
}
.tr-hero-title {
  max-width: 670px; margin-bottom: 1.4rem; font-size: clamp(2.65rem,4.6vw,4.45rem);
  font-weight: 600; line-height: 1.1; letter-spacing: -.048em !important;
}
.tr-hero-lead {
  max-width: 560px; margin-bottom: 1.65rem; color: var(--tr-muted);
  font-size: clamp(1.04rem,1.7vw,1.2rem); line-height: 1.8;
}
.tr-hero-actions { display: flex; gap: .75rem; flex-wrap: wrap; }
.tr-btn-primary, .tr-site .btn-primary {
  padding: .72rem 1.35rem; border: 1px solid var(--tr-primary); border-radius: .55rem;
  background: var(--tr-primary); color: var(--tr-primary-ink);
  font-weight: 600; text-decoration: none;
  transition: background-color .18s ease, transform .18s ease;
}
.tr-btn-primary:hover, .tr-site .btn-primary:hover,
.tr-btn-primary:focus, .tr-site .btn-primary:focus {
  background: var(--tr-primary-hover); border-color: var(--tr-primary-hover);
  color: var(--tr-primary-ink);
}
.tr-btn-primary:active { transform: translateY(1px); }
.tr-hero-actions .btn span { margin-inline-start: .3rem; }
.tr-main { width: 100%; flex: 1 0 auto; padding: 4rem 0 5rem; }
.tr-site--home .tr-main { padding-top: 1rem; }
.tr-breadcrumbs { margin-bottom: 1.6rem; color: var(--tr-muted); }
.tr-breadcrumbs ol, .tr-breadcrumbs ul { margin-bottom: 0; }
.tr-content-top { margin-bottom: 2rem; }
.tr-content-bottom { margin-top: 2.75rem; }
.tr-component { min-width: 0; }
.tr-site--inner .tr-component {
  padding: clamp(1.5rem,3.5vw,3rem); border: 1px solid var(--tr-border);
  border-radius: var(--tr-radius); background: var(--tr-surface); box-shadow: var(--tr-shadow);
}
.tr-component .page-header { margin-bottom: 1.5rem; }
.tr-component .page-header h1 { font-size: clamp(1.75rem,3vw,2.5rem); }
.tr-component img { max-width: 100%; height: auto; }
.tr-component table { width: 100%; }
.tr-component .table-responsive { overflow-x: auto; }
.tr-muted { color: var(--tr-muted); }
.tr-sidebar, .tr-sidebar .card,
.tr-content-top .moduletable, .tr-content-bottom .moduletable {
  padding: 1.3rem; border: 1px solid var(--tr-border);
  border-radius: var(--tr-radius); background: var(--tr-surface);
}
.tr-sidebar .moduletable + .moduletable { margin-top: 1rem; }
.tr-sidebar > * + * { margin-top: 1rem; }
.tr-sidebar h3 { margin-bottom: 1rem; font-size: 1.1rem; }
/* Bootstrap / Joomla core component harmonization. */
.tr-site .card, .tr-site .list-group-item,
.tr-site .dropdown-menu, .tr-site .modal-content {
  border-color: var(--tr-border); background-color: var(--tr-surface); color: var(--tr-ink);
}
.tr-site .card { border-radius: var(--tr-radius); }
.tr-site .form-control, .tr-site .form-select, .tr-site .inputbox {
  border-color: var(--tr-border-strong); border-radius: .5rem;
  background-color: var(--tr-surface); color: var(--tr-ink); min-height: 2.75rem;
}
.tr-site .form-control::placeholder { color: var(--tr-muted); }
.tr-site .btn-outline-secondary { color: var(--tr-ink); border-color: var(--tr-border-strong); }
.tr-site .btn-outline-secondary:hover { color: var(--tr-ink); background: var(--tr-surface-soft); }
.tr-site .table {
  --bs-table-bg: var(--tr-surface); --bs-table-color: var(--tr-ink);
  --bs-table-border-color: var(--tr-border);
}
.tr-site .pagination .page-link {
  color: var(--tr-ink); background: var(--tr-surface); border-color: var(--tr-border);
}
.tr-site .pagination .active .page-link {
  color: var(--tr-primary-ink); background: var(--tr-primary); border-color: var(--tr-primary);
}
.tr-site .alert { border-radius: .6rem; }
.tr-site .badge { font-weight: 600; }
.tr-footer {
  flex-shrink: 0; border-top: 1px solid var(--tr-border);
  background: var(--tr-surface); padding: 3.5rem 0 1.4rem;
}
.tr-footer-grid { align-items: start; padding-bottom: 3rem; }
.tr-footer-brand { display: flex; align-items: center; gap: .5rem; font-size: 1rem; font-weight: 600; }
.tr-footer-brand img { object-fit: contain; }
.tr-footer-description { max-width: 320px; margin: 1rem 0 0; color: var(--tr-muted); font-size: .95rem; }
.tr-footer-modules h3, .tr-footer-modules h4 { margin: 0 0 1rem; font-size: 1rem; }
.tr-footer-modules ul { padding: 0; margin: 0; list-style: none; }
.tr-footer-modules li + li { margin-top: .5rem; }
.tr-footer-modules a { color: var(--tr-muted); text-decoration: none; }
.tr-footer-modules a:hover { color: var(--tr-ink); }
.tr-footer-bottom {
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 1rem; padding-top: 1.3rem;
  border-top: 1px solid var(--tr-border); color: var(--tr-muted); font-size: .82rem;
}
.tr-footer-bottom p { margin-bottom: 0; }
.tr-component-only { display: block !important; }
.tr-error-main {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 100vh; padding: 3rem 1rem;
}
.tr-error-main img { max-width: 100%; height: auto; }
.tr-error-main h1 { font-size: clamp(2rem,5vw,3.5rem); }
@media (max-width: 991.98px) {
  .tr-navbar { min-height: 76px; gap: .5rem; }
  .tr-brand { margin-inline-end: auto; }
  .tr-mobile-toggle { order: 3; margin-inline-start: .35rem; }
  .tr-theme-control { order: 2; }
  .tr-navigation { order: 4; flex-basis: 100%; width: 100%; padding: 1rem 0 .4rem; }
  .tr-navigation ul.mod-menu, .tr-navigation ul.mod-list { display: block; }
  .tr-navigation .mod-menu > li > a { padding: .75rem .7rem; }
  .tr-navigation .mod-menu .mod-menu__sub, .tr-navigation .mod-menu ul ul {
    position: static; display: block; min-width: 0; margin-inline-start: 1rem;
    padding: 0; border: 0; border-inline-start: 1px solid var(--tr-border);
    border-radius: 0; box-shadow: none; background: transparent;
  }
  .tr-header-actions { padding: .75rem 0 0; }
  .tr-hero { padding: 2.5rem 0 5rem; }
  .tr-hero-logo { width: 82%; max-width: 370px; }
  .tr-hero-copy { text-align: center; margin-inline: auto; }
  .tr-hero-title, .tr-hero-lead { margin-inline: auto; }
  .tr-hero-actions { justify-content: center; }
}
@media (max-width: 575.98px) {
  .tr-brand { font-size: .92rem; max-width: calc(100% - 94px); }
  .tr-brand-icon { width: 37px; height: 37px; }
  .tr-theme-trigger { width: 37px; height: 37px; }
  .tr-hero { padding-top: 1.5rem; }
  .tr-hero-title { font-size: 2.45rem; }
  .tr-main { padding: 2.5rem 0 3.5rem; }
  .tr-site--inner .tr-component { padding: 1.3rem; }
  .tr-footer { padding-top: 2.5rem; }
  .tr-footer-bottom { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
@media print {
  .tr-header, .tr-topbar, .tr-footer, .tr-hero-actions,
  .tr-theme-control, .tr-mobile-toggle { display: none !important; }
  .tr-site { background: #fff !important; color: #111 !important; }
  .tr-site--inner .tr-component { padding: 0; border: 0; box-shadow: none; }
}
