:root {
  --eu-navy: #273e57;
  --gold: #c6a354;
  --gold-dark: #a8853c;
  --line: rgba(39,62,87,0.09);
  --ink: #1a2c42;
  --ink-3: #4a5a73;
  --ink-4: #8fa0b5;

  /* Module accents */
  --domain-verbal: #273e57;
  --domain-verbal-bg: rgba(39,62,87,0.10);
  --domain-numerical: #c6a354;
  --domain-numerical-bg: rgba(198,163,84,0.16);
  --domain-abstract: #1a2c42;
  --domain-abstract-bg: rgba(26,44,66,0.09);
}

body {
  background: #fff;
  color: var(--ink, #1a2c42);
}

/* ══════════════════════════════════════════════════════════
   HERO
   Phase 7 — aligned with the landing principal: white-ish base
   with subtle gold/navy radial accents and a navy/gold colour scheme
   for the text instead of the previous solid-navy hero.
══════════════════════════════════════════════════════════ */
.ta-hero {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at top left, rgba(39,62,87,0.08) 0%, transparent 34%),
    radial-gradient(circle at bottom right, rgba(198,163,84,0.10) 0%, transparent 32%),
    linear-gradient(180deg, #f7f6f2 0%, #fbfaf6 48%, #ffffff 100%);
  border-bottom: 1px solid rgba(39,62,87,0.08);
  padding: clamp(52px, 8vw, 88px) 0 clamp(48px, 7vw, 80px);
  isolation: isolate;
}
.ta-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 110% 50%, rgba(198,163,84,0.10) 0%, transparent 70%),
    radial-gradient(ellipse 40% 60% at -10% 50%, rgba(39,62,87,0.06) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}
.ta-hero-bg-grid {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(39,62,87,0.10) 1px, transparent 1px);
  background-size: 28px 28px;
  pointer-events: none;
  opacity: 0.55;
  z-index: 0;
}
.ta-hero-container {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
  gap: clamp(28px, 4vw, 52px);
  align-items: center;
}
.ta-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold, #c6a354);
  margin-bottom: 20px;
}
.ta-eyebrow-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold, #c6a354);
  animation: ta-pulse 2s ease-in-out infinite;
}
@keyframes ta-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}
.ta-hero-title {
  font-family: "Inter Tight", "Inter", system-ui, sans-serif;
  font-size: clamp(2.2rem, 4.5vw, 3.4rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.08;
  color: #1a2c42;
  margin-bottom: 18px;
}
.ta-hero-title strong { color: #c6a354; font-weight: 700; }
.ta-hero-lead {
  font-size: clamp(15px, 1.5vw, 17px);
  line-height: 1.65;
  color: #4f5b73;
  max-width: 50ch;
  margin-bottom: 32px;
}
.ta-hero-stats {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
.ta-stat { text-align: left; }
.ta-stat-val {
  display: block;
  font-size: 22px;
  font-weight: 700;
  color: #1a2c42;
  letter-spacing: -0.02em;
  line-height: 1;
}
.ta-stat-unit {
  font-size: 13px;
  font-weight: 500;
  color: #6a7894;
}
.ta-stat-label {
  display: block;
  margin-top: 3px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #7a88a2;
}
.ta-stat-sep {
  width: 1px;
  height: 32px;
  background: rgba(39,62,87,0.14);
  flex-shrink: 0;
}

/* Recommendation card — Phase 7: white surface with navy accents matching landing */
.ta-reco {
  background: #ffffff;
  border: 1px solid rgba(39,62,87,0.12);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04), 0 12px 28px rgba(15,23,42,0.06);
}
.ta-reco-inner {
  padding: 22px 22px 20px;
}
.ta-reco-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.ta-reco-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold, #c6a354);
}
.ta-reco-kicker-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--gold, #c6a354);
  animation: ta-pulse 1.6s ease-in-out infinite;
}
.ta-reco-duration {
  font-size: 12px;
  font-weight: 600;
  color: #7a88a2;
  background: rgba(39,62,87,0.06);
  border-radius: 99px;
  padding: 3px 10px;
}
.ta-reco-title {
  font-family: "Inter Tight", "Inter", system-ui, sans-serif;
  font-size: clamp(1.3rem, 2.2vw, 1.6rem);
  font-weight: 700;
  letter-spacing: -0.025em;
  color: #1a2c42;
  margin-bottom: 8px;
  line-height: 1.15;
}
.ta-reco-desc {
  font-size: 14px;
  line-height: 1.6;
  color: #4f5b73;
  margin-bottom: 16px;
}
.ta-reco-tags {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
.ta-reco-tag {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 10px;
  border-radius: 99px;
  background: rgba(39,62,87,0.06);
  border: 1px solid rgba(39,62,87,0.10);
  color: #4f5b73;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.03em;
}
.ta-tag-priority {
  background: rgba(198,163,84,0.16);
  border-color: rgba(198,163,84,0.32);
  color: #8a6720;
}
.ta-reco-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.ta-reco-link {
  font-size: 13px;
  font-weight: 600;
  color: #4f5b73;
  text-decoration: none;
  transition: color 0.15s;
}
.ta-reco-link:hover { color: #1a2c42; }


/* ══════════════════════════════════════════════════════════
   BUILDERS SECTION
══════════════════════════════════════════════════════════ */
.ta-builders-section {
  padding: clamp(48px, 6vw, 72px) 0 clamp(32px, 4vw, 48px);
}
.ta-section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 28px;
  flex-wrap: wrap;
}
.ta-section-h2 {
  font-size: clamp(1.3rem, 2.5vw, 1.75rem);
  font-weight: 700;
  letter-spacing: -0.025em;
  color: var(--ink, #0b1424);
  margin-top: 6px;
}
.ta-filter-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  flex-shrink: 0;
}
.ta-filter-chip {
  display: inline-flex;
  align-items: center;
  height: 30px;
  padding: 0 13px;
  border-radius: 99px;
  border: 1px solid var(--line, #e5e8ef);
  background: #fff;
  color: var(--ink-3, #4b5873);
  font-size: 12.5px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.15s;
  white-space: nowrap;
}
.ta-filter-chip:hover {
  border-color: var(--eu-navy, #273e57);
  color: var(--eu-navy, #273e57);
}
.ta-filter-active {
  background: var(--eu-navy, #273e57);
  border-color: var(--eu-navy, #273e57);
  color: #fff;
}

/* Builder card grid */
.ta-builder-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
  margin-bottom: 16px;
}
.ta-bwrap {
  display: flex;
  flex-direction: column;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15,23,42,0.05), 0 4px 16px rgba(15,23,42,0.04);
  transition: box-shadow 0.2s, transform 0.2s;
}
.ta-bwrap:hover {
  box-shadow: 0 2px 4px rgba(15,23,42,0.06), 0 16px 40px rgba(15,23,42,0.1);
  transform: translateY(-2px);
}
.ta-builder {
  display: flex;
  flex-direction: column;
  flex: 1;
  background: #fff;
  border: 1px solid var(--line, #e5e8ef);
  border-radius: 16px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: border-color 0.18s;
}
.ta-bwrap:has(.builder-admin-btn[hidden]) .ta-builder {
  border-radius: 16px;
}
.ta-b-stripe {
  height: 4px;
  width: 100%;
  flex-shrink: 0;
}
.ta-stripe-verbal  { background: var(--domain-verbal, #273e57); }
.ta-stripe-numerical { background: var(--domain-numerical, #c6a354); }
.ta-stripe-abstract { background: var(--domain-abstract, #2f6db3); }

.ta-b-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px 20px 18px;
  flex: 1;
}
.ta-b-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.ta-b-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  flex-shrink: 0;
}
.ta-icon-verbal {
  background: var(--domain-verbal-bg, rgba(39,62,87,0.10));
  color: var(--domain-verbal, #273e57);
}
.ta-icon-numerical {
  background: var(--domain-numerical-bg, rgba(198,163,84,0.16));
  color: var(--domain-numerical, #c6a354);
}
.ta-icon-abstract {
  background: var(--domain-abstract-bg, rgba(47,109,179,0.12));
  color: var(--domain-abstract, #2f6db3);
}
.ta-b-badge {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 9px;
  border-radius: 99px;
  background: var(--bg-soft, #f4f5f8);
  color: var(--ink-3, #4b5873);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.ta-b-badge-focus {
  background: rgba(198,163,84,0.15);
  color: var(--gold-dark, #9a7d37);
}
.ta-b-name {
  font-size: 15.5px;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: var(--ink, #0b1424);
}
.ta-b-desc {
  font-size: 13.5px;
  line-height: 1.58;
  color: var(--ink-3, #4b5873);
  margin: 0;
  flex: 1;
}
.ta-b-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-4, #7a88a2);
  padding-top: 10px;
  border-top: 1px solid var(--line, #e5e8ef);
}
.ta-b-dot { color: var(--ink-5, #a9b4c6); }
.ta-b-cta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  font-weight: 700;
  color: var(--eu-navy, #273e57);
  letter-spacing: 0.01em;
  margin-top: 2px;
  transition: gap 0.15s;
}
.ta-builder:hover .ta-b-cta { gap: 8px; }
.ta-b-verbal:hover   { border-color: rgba(39,62,87,0.35); }
.ta-b-numerical:hover { border-color: rgba(198,163,84,0.45); }
.ta-b-abstract:hover  { border-color: rgba(39,62,87,0.35); }

/* Course cards */
.ta-course-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.ta-course {
  display: block;
  position: relative;
  background: #fff;
  border: 1px solid rgba(198,163,84,0.35);
  border-radius: 16px;
  text-decoration: none;
  overflow: hidden;
  transition: border-color 0.18s, box-shadow 0.2s, transform 0.2s;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04), 0 8px 24px rgba(15,23,42,0.05);
}
.ta-course:hover {
  border-color: rgba(198,163,84,0.6);
  box-shadow: 0 2px 4px rgba(15,23,42,0.06), 0 20px 48px rgba(15,23,42,0.1);
  transform: translateY(-2px);
}
.ta-course-stripe-top {
  height: 4px;
  background: linear-gradient(90deg, #c6a354 0%, #2f6db3 52%, #7fb8ff 100%);
}
.ta-stripe-eufte {
  background: linear-gradient(90deg, #1a2c42 0%, #273e57 52%, #c6a354 100%);
}
.ta-course-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 22px 20px;
  position: relative;
  z-index: 1;
}
.ta-course-left {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  flex: 1;
  min-width: 0;
}
.ta-course-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: rgba(198,163,84,0.12);
  border: 1px solid rgba(198,163,84,0.3);
  color: var(--eu-navy, #1a2940);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}
.ta-course-icon-eufte {
  background: rgba(39,62,87,0.09);
  border-color: rgba(39,62,87,0.22);
  color: var(--eu-navy, #273e57);
}
.ta-course-name {
  display: block;
  font-size: 15.5px;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: var(--ink, #0b1424);
  margin-bottom: 5px;
}
.ta-course-desc {
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink-3, #4b5873);
  margin: 0 0 10px;
}
.ta-course-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.ta-course-date {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-4, #7a88a2);
}
.ta-course-pill {
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 8px;
  border-radius: 99px;
  background: var(--eu-navy, #273e57);
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.ta-pill-eufte { background: var(--eu-navy, #273e57); }
.ta-course-pill-pro {
  background: linear-gradient(135deg, var(--gold, #c6a354) 0%, #a8853c 100%);
  color: #1a1404;
}
.ta-course-tag {
  display: inline-flex;
  align-items: center;
  margin-bottom: 8px;
  padding: 4px 10px;
  border-radius: 99px;
  background: rgba(198,163,84,0.16);
  color: #8a6720;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.ta-course-tag-eufte {
  background: rgba(39,62,87,0.10);
  color: var(--eu-navy, #273e57);
}
.ta-course-bullets {
  margin: 10px 0 14px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}
.ta-course-bullets li {
  position: relative;
  padding-left: 20px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink-3, #4b5873);
}
.ta-course-bullets li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 6px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold, #c6a354);
  box-shadow: inset 0 0 0 2px #fff;
  border: 1.5px solid var(--gold-dark, #a8853c);
}
.ta-course-eufte .ta-course-bullets li::before {
  background: var(--eu-navy, #273e57);
  border-color: var(--eu-navy, #273e57);
}
.ta-course-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  padding: 9px 16px;
  border-radius: 10px;
  background: rgba(198,163,84,0.12);
  color: var(--gold-dark, #a8853c);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.01em;
  transition: background 0.15s, color 0.15s, gap 0.15s;
  flex-shrink: 0;
}
.ta-course:hover .ta-course-cta {
  background: var(--gold-dark, #a8853c);
  color: #fff;
  gap: 10px;
}
.ta-cta-eufte {
  background: rgba(39,62,87,0.08);
  color: var(--eu-navy, #273e57);
}
.ta-course-eufte:hover .ta-cta-eufte {
  background: var(--eu-navy, #273e57);
  color: #fff;
}
.ta-course-watermark {
  position: absolute;
  right: -10px;
  bottom: -16px;
  font-size: 96px;
  font-weight: 900;
  letter-spacing: -0.04em;
  color: rgba(198,163,84,0.06);
  pointer-events: none;
  user-select: none;
  line-height: 1;
  z-index: 0;
}
.ta-wm-eufte { color: rgba(39,62,87,0.05); }

/* Admin toolbar */
.admin-toolbar {
  background: linear-gradient(180deg, rgba(255,250,237,0.92) 0%, rgba(252,247,231,0.98) 100%);
  border-top: 1px solid var(--gold-light, #e6d09a);
  border-bottom: 1px solid var(--gold-light, #e6d09a);
  padding: 10px 0;
  margin-top: 8px;
}
.admin-toolbar-inner {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.admin-toolbar-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gold-dark, #9a7d37);
}
.admin-toolbar-text {
  font-size: 13px;
  color: var(--ink-3, #4b5873);
  flex: 1;
}
.admin-toolbar-logout {
  background: none;
  border: 1px solid var(--gold-light, #e6d09a);
  color: var(--gold-dark, #9a7d37);
  font-size: 12px;
  font-weight: 600;
  font-family: inherit;
  border-radius: 6px;
  padding: 4px 10px;
  cursor: pointer;
  transition: background 0.15s;
}
.admin-toolbar-logout:hover { background: rgba(198,163,84,0.1); }

.builder-admin-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gold-dark, #9a7d37);
  background: var(--gold-50, #faf5e8);
  border: 1px solid var(--gold-light, #e6d09a);
  border-top: none;
  border-radius: 0 0 12px 12px;
  padding: 7px 14px;
  text-decoration: none;
  transition: background 0.15s;
}
.builder-admin-btn:hover { background: #f0e9d0; }

/* ══════════════════════════════════════════════════════════
   FLOW SECTION
══════════════════════════════════════════════════════════ */
.ta-flow-section {
  padding: clamp(12px, 2vw, 24px) 0 clamp(32px, 4vw, 48px);
}
.ta-flow-card {
  background: #fff;
  border: 1px solid var(--line, #e5e8ef);
  border-radius: 20px;
  padding: clamp(28px, 4vw, 44px);
  box-shadow: 0 1px 2px rgba(15,23,42,0.04), 0 8px 24px rgba(15,23,42,0.05);
}
.ta-flow-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 36px;
  flex-wrap: wrap;
}
.ta-flow-title {
  font-size: clamp(1.15rem, 2.2vw, 1.5rem);
  font-weight: 700;
  letter-spacing: -0.022em;
  color: var(--ink, #0b1424);
  margin-top: 6px;
}
.ta-flow-sub {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-4, #7a88a2);
  max-width: 30ch;
  text-align: right;
  margin-top: 6px;
}
.ta-flow-steps {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.ta-step {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}
.ta-step-left {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  width: 36px;
}
.ta-step-num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--eu-navy, #273e57);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  flex-shrink: 0;
}
.ta-step-line {
  width: 2px;
  height: 36px;
  background: linear-gradient(to bottom, rgba(39,62,87,0.2), rgba(39,62,87,0.05));
  margin: 4px 0;
}
.ta-step-right {
  padding-bottom: 32px;
  flex: 1;
}
.ta-step-last .ta-step-right {
  padding-bottom: 0;
}
.ta-step-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  margin-bottom: 8px;
}
.ta-step-icon-warm    { background: rgba(198,163,84,0.14); color: var(--gold-dark, #9a7d37); }
.ta-step-icon-practice { background: rgba(39,62,87,0.10);  color: var(--eu-navy, #273e57); }
.ta-step-icon-measure  { background: rgba(198,163,84,0.14);  color: var(--gold-dark, #9a7d37); }
.ta-step-right strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--ink, #0b1424);
  margin-bottom: 5px;
}
.ta-step-right p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-3, #4b5873);
  margin: 0;
}

/* ══════════════════════════════════════════════════════════
   NEXT STEP
══════════════════════════════════════════════════════════ */
.ta-next-section {
  padding: clamp(12px, 2vw, 24px) 0 clamp(48px, 6vw, 72px);
}
.ta-next {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 400px);
  gap: clamp(32px, 4vw, 60px);
  align-items: center;
  background: linear-gradient(135deg, var(--eu-navy, #1a2940) 0%, #0f1e32 100%);
  border-radius: 22px;
  padding: clamp(36px, 5vw, 56px) clamp(28px, 5vw, 52px);
  overflow: hidden;
  position: relative;
}
.ta-next::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 50% 70% at 110% 50%, rgba(198,163,84,0.08) 0%, transparent 70%);
  pointer-events: none;
}
.ta-next-copy { position: relative; z-index: 1; }
.ta-next-copy .eyebrow { color: var(--gold, #c6a354); }
.ta-next-title {
  font-size: clamp(1.3rem, 2.5vw, 1.9rem);
  font-weight: 700;
  letter-spacing: -0.025em;
  color: #fff;
  margin: 8px 0 12px;
  line-height: 1.18;
}
.ta-next-desc {
  font-size: 14.5px;
  line-height: 1.65;
  color: rgba(255,255,255,0.55);
  margin-bottom: 24px;
}
.ta-next-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.ta-next-visual { position: relative; z-index: 1; }

/* Simulator preview card */
.ta-sim-preview {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 16px;
  overflow: hidden;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.ta-sim-top {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
}
.ta-sim-dots { display: flex; gap: 5px; }
.ta-sim-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: rgba(255,255,255,0.15);
}
.ta-sim-label {
  font-size: 11px;
  font-weight: 600;
  color: rgba(255,255,255,0.35);
  letter-spacing: 0.04em;
  margin-left: auto;
}
.ta-sim-rows {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px 18px 14px;
}
.ta-sim-row {
  display: grid;
  grid-template-columns: 72px 1fr 36px;
  align-items: center;
  gap: 10px;
}
.ta-sim-track {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.ta-sim-track-bar {
  height: 6px;
  border-radius: 99px;
  background: rgba(255,255,255,0.08);
  overflow: hidden;
}
.ta-sim-fill {
  height: 100%;
  border-radius: 99px;
  opacity: 0.85;
}
.ta-sim-pct {
  font-size: 11.5px;
  font-weight: 700;
  color: rgba(255,255,255,0.65);
  text-align: right;
}
.ta-pct-warn { color: var(--domain-numerical, #c6a354); }
.ta-sim-score {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 18px;
  border-top: 1px solid rgba(255,255,255,0.07);
}
.ta-sim-score-label {
  font-size: 11.5px;
  color: rgba(255,255,255,0.4);
  font-weight: 500;
}
.ta-sim-score-val {
  font-size: 13.5px;
  font-weight: 700;
  color: #fff;
}

/* ══════════════════════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════════════════════ */
@media (max-width: 960px) {
  .ta-hero-container {
    grid-template-columns: 1fr;
  }
  .ta-reco { max-width: 480px; }
  .ta-next {
    grid-template-columns: 1fr;
  }
  .ta-next-visual { max-width: 420px; }
  .ta-flow-header {
    flex-direction: column;
  }
  .ta-flow-sub { text-align: left; max-width: none; }
}
@media (max-width: 720px) {
  .ta-builder-grid { grid-template-columns: 1fr; }
  .ta-course-grid   { grid-template-columns: 1fr; }
  .ta-section-header {
    flex-direction: column;
    align-items: flex-start;
  }
  .ta-course-content {
    flex-direction: column;
    align-items: flex-start;
  }
  .ta-course-cta { align-self: flex-start; }
}
@media (max-width: 480px) {
  .ta-hero-stats { gap: 14px; }
  .ta-next { padding: 28px 22px; }
  .ta-flow-card { padding: 22px 18px; }
}

/* Compact training cockpit */
.ta-cockpit-page {
  --ta-bg: #f7f9fc;
  --ta-surface: #ffffff;
  --ta-ink: #14243a;
  --ta-muted: #647187;
  --ta-line: rgba(39,62,87,0.12);
  --ta-navy: #273e57;
  --ta-gold: #c6a354;
  --ta-verbal: #273e57;
  --ta-numerical: #c6a354;
  --ta-eu: #2f6db3;
  --ta-eufte: #7c5a2b;
  background:
    linear-gradient(180deg, #f7f9fc 0%, #ffffff 68%);
  color: var(--ta-ink);
}
.ta-cockpit {
  padding: clamp(24px, 4vw, 44px) 0 22px;
  border-bottom: 1px solid var(--ta-line);
}
.ta-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(320px, 0.72fr);
  gap: 18px;
  align-items: stretch;
}
.ta-hero-panel,
.ta-reco,
.ta-module,
.ta-route,
.ta-next-compact {
  border: 1px solid var(--ta-line);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 18px 50px rgba(20,36,58,0.08);
}
.ta-hero-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: space-between;
  gap: 20px;
  min-height: 262px;
  padding: clamp(22px, 4vw, 34px);
  border-radius: 18px;
  overflow: hidden;
  position: relative;
}
.ta-hero-panel::after {
  content: "";
  position: absolute;
  inset: auto -48px -88px auto;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(198,163,84,0.18), transparent 66%);
  pointer-events: none;
}
.ta-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--ta-gold);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.09em;
  line-height: 1;
  text-transform: uppercase;
}
.ta-kicker::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 99px;
  background: currentColor;
}
.ta-hero-title {
  max-width: 820px;
  margin: 14px 0 10px;
  color: var(--ta-ink);
  font-family: "Inter Tight", "Inter", system-ui, sans-serif;
  font-size: clamp(2.05rem, 4vw, 3.35rem);
  font-weight: 800;
  letter-spacing: 0;
  line-height: 0.98;
}
.ta-hero-lead {
  max-width: 48ch;
  margin: 0;
  color: var(--ta-muted);
  font-size: clamp(14px, 1.4vw, 16px);
  line-height: 1.55;
}
.ta-hero-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 20px;
}
.ta-primary-action,
.ta-reco-actions .btn,
.ta-next-actions .btn {
  min-height: 38px;
  padding: 0 16px;
  border-radius: 10px;
  white-space: nowrap;
}
.ta-inline-action {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  color: var(--ta-navy);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}
.ta-inline-action:hover { color: #111827; }
.ta-inline-action-strong {
  padding: 0 12px;
  border: 1px solid var(--ta-line);
  border-radius: 10px;
  background: #fff;
}
.ta-metrics {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  max-width: 560px;
}
.ta-metric {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid rgba(39,62,87,0.10);
  border-radius: 12px;
  background: #f9fbfd;
}
.ta-metric strong {
  color: var(--ta-ink);
  font-size: 18px;
  line-height: 1;
}
.ta-metric span {
  color: var(--ta-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.ta-reco {
  --mission-color: var(--ta-numerical);
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  min-height: 262px;
  padding: 24px;
  border-radius: 18px;
  overflow: hidden;
}
.ta-reco[data-track="verbal"] { --mission-color: var(--ta-verbal); }
.ta-reco[data-track="eu"] { --mission-color: var(--ta-eu); }
.ta-reco[data-track="digital"],
.ta-reco[data-track="eufte"] { --mission-color: var(--ta-eufte); }
.ta-reco-ring {
  display: grid;
  place-items: center;
  width: 132px;
  height: 132px;
  border-radius: 50%;
  background:
    conic-gradient(var(--mission-color) calc(var(--mission-progress, 68) * 1%), rgba(39,62,87,0.10) 0);
  box-shadow: inset 0 0 0 1px rgba(39,62,87,0.10);
}
.ta-ring-core {
  display: grid;
  place-items: center;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: #fff;
  text-align: center;
  box-shadow: 0 10px 26px rgba(20,36,58,0.10);
}
.ta-reco-score {
  color: var(--ta-ink);
  font-size: 25px;
  font-weight: 900;
  line-height: 1;
}
.ta-ring-core small {
  color: var(--ta-muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.ta-reco-header,
.ta-reco-actions,
.ta-reco-tags {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.ta-reco-header { justify-content: space-between; margin-bottom: 12px; }
.ta-reco-title {
  margin: 0 0 8px;
  color: var(--ta-ink);
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1.08;
}
.ta-reco-desc {
  margin: 0 0 14px;
  color: var(--ta-muted);
  font-size: 14px;
  line-height: 1.45;
}
.ta-reco-duration,
.ta-reco-tag {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  border: 1px solid rgba(39,62,87,0.10);
  background: #f8fafc;
  color: var(--ta-muted);
  font-size: 11px;
  font-weight: 800;
}
.ta-tag-priority {
  border-color: rgba(198,163,84,0.38);
  background: rgba(198,163,84,0.16);
  color: #7a5a17;
}
.ta-reco-actions { margin-top: 16px; }
.ta-matrix-section {
  padding: 26px 0 16px;
}
.ta-section-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.ta-section-title {
  margin: 8px 0 0;
  color: var(--ta-ink);
  font-size: clamp(1.45rem, 2.5vw, 2rem);
  line-height: 1.1;
  letter-spacing: 0;
}
.ta-module-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.ta-module-wrap {
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.ta-module {
  --track-color: var(--ta-verbal);
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  grid-template-areas:
    "icon status status"
    "icon title title"
    "desc desc desc"
    "meta meta cta";
  gap: 8px 10px;
  min-height: 182px;
  padding: 16px;
  border-radius: 14px;
  color: var(--ta-ink);
  text-decoration: none;
  position: relative;
  overflow: hidden;
}
.ta-module::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--track-color);
}
.ta-module[data-track="numerical"] { --track-color: var(--ta-numerical); }
.ta-module[data-track="eu"] { --track-color: var(--ta-eu); }
.ta-module[data-track="eufte"] { --track-color: var(--ta-eufte); }
.ta-module[data-focus="today"] {
  border-color: rgba(198,163,84,0.42);
  box-shadow: 0 18px 44px rgba(198,163,84,0.16);
}
.ta-module:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--track-color) 48%, var(--ta-line));
}
.ta-module-icon {
  grid-area: icon;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: color-mix(in srgb, var(--track-color) 13%, #fff);
  color: var(--track-color);
}
.ta-module-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ta-module-icon-text {
  font-size: 13px;
  font-weight: 900;
}
.ta-module-status {
  grid-area: status;
  justify-self: end;
  align-self: start;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--track-color) 12%, #fff);
  color: var(--track-color);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.06em;
  line-height: 22px;
  text-transform: uppercase;
}
.ta-module strong {
  grid-area: title;
  min-width: 0;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.08;
}
.ta-module p {
  grid-area: desc;
  min-height: 38px;
  margin: 4px 0 0;
  color: var(--ta-muted);
  font-size: 13px;
  line-height: 1.4;
}
.ta-module-meta {
  grid-area: meta;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: var(--ta-muted);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}
.ta-module-meta span + span::before {
  content: "/";
  margin-right: 6px;
  color: rgba(100,113,135,0.55);
}
.ta-module-cta {
  grid-area: cta;
  justify-self: end;
  align-self: end;
  color: var(--track-color);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.builder-admin-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 32px;
  margin-top: 8px;
  border-radius: 10px;
  border: 1px dashed rgba(39,62,87,0.24);
  color: var(--ta-navy);
  background: #fff;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}
.builder-admin-btn[hidden] { display: none !important; }
.admin-toolbar {
  position: static;
  margin: 14px 0 0;
  padding: 0;
  background: transparent;
  border: 0;
}
.admin-toolbar-inner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(39,62,87,0.14);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(20,36,58,0.06);
}
.admin-toolbar-badge,
.admin-toolbar-logout {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 850;
}
.admin-toolbar-text {
  color: var(--ta-muted);
  font-size: 12px;
}
.admin-toolbar-logout {
  margin-left: auto;
  border: 0;
  background: transparent;
  color: var(--ta-navy);
  cursor: pointer;
}
.ta-route-section { padding: 12px 0 16px; }
.ta-route {
  display: grid;
  grid-template-columns: minmax(180px, 0.34fr) minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  padding: 16px;
  border-radius: 16px;
}
.ta-route-head h2 {
  margin: 8px 0 0;
  color: var(--ta-ink);
  font-size: clamp(1.2rem, 2vw, 1.65rem);
  letter-spacing: 0;
  line-height: 1.12;
}
.ta-route-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ta-route-steps li {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid rgba(39,62,87,0.08);
}
.ta-route-steps span {
  color: var(--ta-gold);
  font-size: 11px;
  font-weight: 900;
}
.ta-route-steps strong {
  color: var(--ta-ink);
  font-size: 14px;
}
.ta-route-steps small {
  color: var(--ta-muted);
  font-size: 11px;
  font-weight: 800;
}
.ta-next-section { padding: 12px 0 clamp(42px, 6vw, 76px); }
.ta-next-compact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px;
  border-radius: 16px;
}
.ta-next-compact h2 {
  margin: 8px 0 0;
  color: var(--ta-ink);
  font-size: clamp(1.25rem, 2.4vw, 1.85rem);
  line-height: 1.08;
  letter-spacing: 0;
}
.ta-next-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
@media (prefers-reduced-motion: no-preference) {
  .ta-module,
  .ta-inline-action,
  .ta-reco,
  .ta-hero-panel {
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease;
  }
}
@media (max-width: 980px) {
  .ta-shell,
  .ta-route {
    grid-template-columns: 1fr;
  }
  .ta-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .ta-metric {
    grid-template-columns: 1fr;
    gap: 3px;
  }
  .ta-module-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  .ta-cockpit { padding-top: 18px; }
  .ta-hero-panel,
  .ta-reco,
  .ta-route,
  .ta-next-compact {
    border-radius: 14px;
  }
  .ta-hero-panel {
    min-height: 0;
    padding: 20px;
  }
  .ta-hero-title {
    font-size: clamp(1.75rem, 9.6vw, 2.45rem);
  }
  .ta-hero-actions,
  .ta-next-actions {
    align-items: stretch;
    width: 100%;
  }
  .ta-hero-actions .btn,
  .ta-hero-actions .ta-inline-action,
  .ta-next-actions .btn {
    justify-content: center;
    flex: 1 1 auto;
  }
  .ta-metrics {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 6px;
  }
  .ta-metric {
    padding: 9px 8px;
  }
  .ta-metric strong { font-size: 16px; }
  .ta-metric span { font-size: 9px; }
  .ta-reco {
    grid-template-columns: 90px minmax(0, 1fr);
    gap: 14px;
    min-height: 0;
    padding: 16px;
  }
  .ta-reco-ring {
    width: 90px;
    height: 90px;
  }
  .ta-ring-core {
    width: 66px;
    height: 66px;
  }
  .ta-reco-score { font-size: 18px; }
  .ta-ring-core small { font-size: 8px; }
  .ta-reco-title { font-size: 1.25rem; }
  .ta-reco-desc { font-size: 13px; }
  .ta-section-row,
  .ta-next-compact {
    align-items: flex-start;
    flex-direction: column;
  }
  .ta-module-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .ta-module {
    min-height: 0;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    grid-template-areas:
      "icon title status"
      "icon desc desc"
      "meta meta cta";
    padding: 14px 14px 14px 16px;
  }
  .ta-module p {
    min-height: 0;
    margin-top: 0;
  }
  .ta-route-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .ta-route {
    gap: 10px;
  }
  .ta-route-steps li {
    padding: 9px 10px;
  }
}
@media (max-width: 380px) {
  .ta-shell,
  .ta-module-grid {
    gap: 10px;
  }
  .ta-hero-panel,
  .ta-reco,
  .ta-route,
  .ta-next-compact {
    padding: 14px;
  }
  .ta-reco {
    grid-template-columns: 1fr;
  }
  .ta-reco-ring {
    justify-self: start;
  }
  .ta-module-status {
    max-width: 86px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* Mission Control premium redesign */
.ta-mission-page {
  --ta-ink: #111d31;
  --ta-muted: #637089;
  --ta-soft: #f5f8fc;
  --ta-line: rgba(39,62,87,0.14);
  --ta-navy: #273e57;
  --ta-navy-deep: #0f1c2e;
  --ta-gold: #c6a354;
  --ta-verbal: #273e57;
  --ta-numerical: #c6a354;
  --ta-eu: #2f6db3;
  --ta-eufte: #7d5f31;
  background:
    linear-gradient(180deg, #f3f6fb 0%, #ffffff 62%),
    radial-gradient(circle at 14% 12%, rgba(198,163,84,0.16), transparent 28%);
  color: var(--ta-ink);
}
.ta-mission-page .ta-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--ta-gold);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.11em;
  line-height: 1;
  text-transform: uppercase;
}
.ta-mission-page .ta-kicker::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 99px;
  background: currentColor;
  box-shadow: 0 0 0 5px rgba(198,163,84,0.14);
}
.ta-mission-control {
  padding: clamp(22px, 3.8vw, 44px) 0 18px;
  border-bottom: 1px solid var(--ta-line);
}
.ta-mc-grid {
  display: grid;
  grid-template-columns: minmax(230px, 0.72fr) minmax(380px, 1.2fr) minmax(250px, 0.78fr);
  gap: 14px;
  align-items: stretch;
}
.ta-command-card,
.ta-mission-card,
.ta-radar-card,
.ta-skill-row,
.ta-drill-builder,
.ta-launch-band {
  border: 1px solid var(--ta-line);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 20px 60px rgba(15,28,46,0.09);
}
.ta-command-card {
  display: grid;
  align-content: space-between;
  min-height: 416px;
  padding: 22px;
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(15,28,46,0.98), rgba(39,62,87,0.94)),
    var(--ta-navy-deep);
  color: #fff;
  overflow: hidden;
  position: relative;
}
.ta-command-card::after {
  content: "";
  position: absolute;
  width: 260px;
  height: 260px;
  right: -120px;
  bottom: -120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(198,163,84,0.35), transparent 66%);
  pointer-events: none;
}
.ta-command-title {
  position: relative;
  z-index: 1;
  margin: 16px 0 10px;
  color: #fff;
  font-family: "Inter Tight", "Inter", system-ui, sans-serif;
  font-size: clamp(2.1rem, 3.4vw, 3.35rem);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 0.96;
}
.ta-command-actions,
.ta-launch-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.ta-command-actions {
  position: relative;
  z-index: 1;
  margin: 18px 0;
}
.ta-track-picker {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 14px;
}
.ta-track-picker button {
  min-height: 36px;
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 10px;
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.78);
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}
.ta-track-picker button.is-active {
  border-color: rgba(198,163,84,0.62);
  background: rgba(198,163,84,0.20);
  color: #ffe3a0;
}
.ta-primary-action,
.ta-mission-action,
.ta-launch-actions .btn {
  min-height: 38px;
  padding: 0 15px;
  border-radius: 10px;
  white-space: nowrap;
}
.ta-text-action {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  color: var(--ta-navy);
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
}
.ta-command-card .ta-text-action { color: rgba(255,255,255,0.86); }
.ta-status-stack {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 8px;
}
.ta-status-pill {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 12px;
  background: rgba(255,255,255,0.08);
}
.ta-status-pill span {
  color: rgba(255,255,255,0.64);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.ta-status-pill strong {
  color: #fff;
  font-size: 15px;
}
.ta-mission-card {
  --mission-color: var(--ta-numerical);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 14px;
  min-height: 416px;
  padding: 18px;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
}
.ta-mission-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 90% 8%, color-mix(in srgb, var(--mission-color) 20%, transparent), transparent 28%),
    linear-gradient(115deg, transparent 0 58%, rgba(39,62,87,0.04) 58% 59%, transparent 59%);
  pointer-events: none;
}
.ta-mission-card[data-track="verbal"] { --mission-color: var(--ta-verbal); }
.ta-mission-card[data-track="eu"] { --mission-color: var(--ta-eu); }
.ta-mission-card[data-track="digital"],
.ta-mission-card[data-track="eufte"] { --mission-color: var(--ta-eufte); }
.ta-mission-top,
.ta-mission-bottom,
.ta-question-preview {
  position: relative;
  z-index: 1;
}
.ta-mission-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.ta-mission-duration {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--mission-color) 30%, var(--ta-line));
  background: color-mix(in srgb, var(--mission-color) 9%, #fff);
  color: var(--ta-navy);
  font-size: 11px;
  font-weight: 900;
}
.ta-question-preview {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-radius: 16px;
  background:
    linear-gradient(180deg, #101d30, #172b45);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 18px 34px rgba(15,28,46,0.16);
}
.ta-question-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: rgba(255,255,255,0.62);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.ta-question-bar strong {
  color: #f3d27a;
  font-size: 12px;
}
.ta-question-preview p {
  margin: 0;
  color: #fff;
  font-size: clamp(1rem, 1.7vw, 1.22rem);
  font-weight: 800;
  line-height: 1.25;
}
.ta-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.ta-options button {
  min-width: 0;
  padding: 9px 8px;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 10px;
  background: rgba(255,255,255,0.07);
  color: rgba(255,255,255,0.74);
  font-size: 12px;
  font-weight: 850;
  text-align: center;
  cursor: pointer;
}
.ta-options button:hover {
  border-color: rgba(255,255,255,0.30);
  color: #fff;
}
.ta-options button.is-selected {
  border-color: rgba(198,163,84,0.55);
  background: rgba(198,163,84,0.18);
  color: #ffe4a0;
}
.ta-options button.is-correct {
  border-color: rgba(34,197,94,0.62);
  background: rgba(34,197,94,0.16);
  color: #bbf7d0;
}
.ta-options button.is-wrong {
  border-color: rgba(239,68,68,0.58);
  background: rgba(239,68,68,0.14);
  color: #fecaca;
}
.ta-answer-feedback {
  min-height: 22px;
  color: rgba(255,255,255,0.66);
  font-size: 12px;
  font-weight: 800;
}
.ta-answer-feedback.is-correct { color: #bbf7d0; }
.ta-answer-feedback.is-wrong { color: #fecaca; }
.ta-mission-bottom {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
}
.ta-mission-ring {
  display: grid;
  place-items: center;
  width: 116px;
  height: 116px;
  border-radius: 50%;
  background: conic-gradient(var(--mission-color) calc(var(--mission-progress, 68) * 1%), rgba(39,62,87,0.10) 0);
}
.ta-ring-core {
  display: grid;
  place-items: center;
  width: 82px;
  height: 82px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 12px 28px rgba(15,28,46,0.12);
  text-align: center;
}
.ta-mission-score {
  color: var(--ta-ink);
  font-size: 22px;
  font-weight: 950;
  line-height: 1;
}
.ta-ring-core small {
  color: var(--ta-muted);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.ta-mission-title {
  margin: 0 0 6px;
  color: var(--ta-ink);
  font-size: clamp(1.25rem, 2vw, 1.62rem);
  font-weight: 950;
  line-height: 1.05;
}
.ta-mission-desc {
  margin: 0;
  color: var(--ta-muted);
  font-size: 13px;
  line-height: 1.42;
}
.ta-mission-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 10px 0 13px;
}
.ta-mission-tags span {
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--mission-color) 12%, #fff);
  color: color-mix(in srgb, var(--mission-color) 82%, var(--ta-navy));
  font-size: 10px;
  font-weight: 900;
  line-height: 22px;
}
.ta-radar-card {
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 12px;
  min-height: 416px;
  padding: 18px;
  border-radius: 18px;
}
.ta-radar-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
}
.ta-radar-head strong {
  color: var(--ta-ink);
  font-size: 15px;
}
.ta-radar-orbit {
  position: relative;
  min-height: 160px;
  border-radius: 18px;
  background:
    radial-gradient(circle at 50% 50%, rgba(39,62,87,0.09) 0 2px, transparent 3px),
    repeating-radial-gradient(circle at 50% 50%, transparent 0 34px, rgba(39,62,87,0.08) 35px 36px),
    linear-gradient(180deg, #f8fafc, #ffffff);
  border: 1px solid rgba(39,62,87,0.08);
  overflow: hidden;
}
.ta-orbit-core {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--ta-navy);
  color: #fff;
  font-size: 12px;
  font-weight: 950;
}
.ta-radar-orbit i {
  position: absolute;
  left: var(--x);
  top: var(--y);
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--c) 17%, #fff);
  color: var(--c);
  box-shadow: 0 0 0 calc(var(--s) / 14) color-mix(in srgb, var(--c) 10%, transparent);
  font-size: 11px;
  font-style: normal;
  font-weight: 950;
}
.ta-heat-list {
  display: grid;
  gap: 8px;
}
.ta-heat-row {
  --heat-color: var(--ta-verbal);
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr) 38px;
  align-items: center;
  gap: 8px;
  color: var(--ta-muted);
  font-size: 11px;
  font-weight: 850;
}
.ta-heat-row[data-heat-key="numerical"] { --heat-color: var(--ta-numerical); }
.ta-heat-row[data-heat-key="eu"] { --heat-color: var(--ta-eu); }
.ta-heat-row[data-heat-key="eufte"] { --heat-color: var(--ta-eufte); }
.ta-heat-row b {
  height: 8px;
  border-radius: 999px;
  background: rgba(39,62,87,0.09);
  overflow: hidden;
}
.ta-heat-row b i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--heat-color);
}
.ta-heat-row strong {
  color: var(--ta-ink);
  font-size: 11px;
  text-align: right;
}
.ta-heat-row.is-weak span,
.ta-heat-row.is-weak strong { color: #8a671d; }
.ta-skill-map-section {
  padding: 26px 0 10px;
}
.ta-section-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.ta-section-title {
  margin: 8px 0 0;
  color: var(--ta-ink);
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  letter-spacing: 0;
  line-height: 1.05;
}
.ta-plan-action {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid var(--ta-line);
  border-radius: 10px;
  background: #fff;
}
.ta-skill-list {
  display: grid;
  gap: 9px;
}
.ta-skill-item {
  --skill-color: var(--ta-verbal);
  display: grid;
  gap: 7px;
}
.ta-skill-item[data-track="numerical"] { --skill-color: var(--ta-numerical); }
.ta-skill-item[data-track="eu"] { --skill-color: var(--ta-eu); }
.ta-skill-item[data-track="eufte"] { --skill-color: var(--ta-eufte); }
.ta-skill-row {
  display: grid;
  grid-template-columns: 44px minmax(170px, 1fr) minmax(90px, 0.32fr) minmax(88px, 0.24fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 74px;
  padding: 12px 14px;
  border-radius: 14px;
  color: var(--ta-ink);
  text-decoration: none;
  position: relative;
  overflow: hidden;
}
.ta-skill-row::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--skill-color);
}
.ta-skill-item.is-active .ta-skill-row {
  border-color: color-mix(in srgb, var(--skill-color) 44%, var(--ta-line));
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--skill-color) 10%, #fff), #fff 42%);
}
.ta-skill-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: color-mix(in srgb, var(--skill-color) 13%, #fff);
  color: var(--skill-color);
}
.ta-skill-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ta-skill-icon-text {
  font-size: 12px;
  font-weight: 950;
}
.ta-skill-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.ta-skill-main strong {
  font-size: 15px;
  font-weight: 950;
  line-height: 1.05;
}
.ta-skill-main small,
.ta-skill-meta small {
  color: var(--ta-muted);
  font-size: 12px;
  line-height: 1.25;
}
.ta-skill-progress {
  height: 10px;
  border-radius: 999px;
  background: rgba(39,62,87,0.09);
  overflow: hidden;
}
.ta-skill-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--skill-color);
}
.ta-skill-meta {
  display: grid;
  gap: 2px;
}
.ta-skill-meta b {
  font-size: 12px;
  font-weight: 950;
}
.ta-skill-cta {
  color: var(--skill-color);
  font-size: 12px;
  font-weight: 950;
  white-space: nowrap;
}
.builder-admin-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 32px;
  border-radius: 10px;
  border: 1px dashed rgba(39,62,87,0.24);
  color: var(--ta-navy);
  background: #fff;
  font-size: 12px;
  font-weight: 850;
  text-decoration: none;
}
.builder-admin-btn[hidden] { display: none !important; }
.admin-toolbar {
  position: static;
  margin: 14px 0 0;
  padding: 0;
  background: transparent;
  border: 0;
}
.admin-toolbar-inner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(39,62,87,0.14);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(20,36,58,0.06);
}
.admin-toolbar-badge,
.admin-toolbar-logout {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 850;
}
.admin-toolbar-text {
  color: var(--ta-muted);
  font-size: 12px;
}
.admin-toolbar-logout {
  margin-left: auto;
  border: 0;
  background: transparent;
  color: var(--ta-navy);
  cursor: pointer;
}
.ta-drill-section { padding: 14px 0 14px; }
.ta-drill-builder {
  padding: 16px;
  border-radius: 16px;
}
.ta-drill-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.ta-drill-head h2 {
  margin: 7px 0 0;
  color: var(--ta-ink);
  font-size: clamp(1.2rem, 2vw, 1.6rem);
  line-height: 1.08;
}
.ta-duration-tabs {
  display: inline-grid;
  grid-template-columns: repeat(3, 42px);
  gap: 4px;
  padding: 4px;
  border-radius: 12px;
  background: #eef2f7;
}
.ta-duration-tabs button {
  height: 32px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--ta-muted);
  font-weight: 950;
  cursor: pointer;
}
.ta-duration-tabs button.is-active {
  background: var(--ta-navy);
  color: #fff;
  box-shadow: 0 8px 18px rgba(39,62,87,0.18);
}
.ta-drill-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ta-drill-steps li {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid rgba(39,62,87,0.08);
  border-radius: 12px;
  background: #f8fafc;
}
.ta-drill-steps span {
  color: var(--ta-gold);
  font-size: 11px;
  font-weight: 950;
}
.ta-drill-steps strong {
  color: var(--ta-ink);
  font-size: 14px;
}
.ta-drill-steps small {
  color: var(--ta-muted);
  font-size: 11px;
  font-weight: 850;
}
.ta-next-section { padding: 12px 0 clamp(42px, 6vw, 76px); }
.ta-launch-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px;
  border-radius: 16px;
  background:
    linear-gradient(135deg, #ffffff 0%, #f8fafc 58%, rgba(198,163,84,0.12) 100%);
}
.ta-launch-band h2 {
  margin: 7px 0 0;
  color: var(--ta-ink);
  font-size: clamp(1.25rem, 2.4vw, 1.85rem);
  line-height: 1.08;
}
@media (prefers-reduced-motion: no-preference) {
  .ta-skill-row,
  .ta-mission-card,
  .ta-command-card,
  .ta-radar-card,
  .ta-duration-tabs button {
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
  }
  .ta-skill-row:hover,
  .ta-mission-card:hover,
  .ta-radar-card:hover {
    transform: translateY(-2px);
  }
}
@media (max-width: 1100px) {
  .ta-mc-grid {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.8fr);
  }
  .ta-radar-card {
    grid-column: 1 / -1;
    min-height: 0;
    grid-template-columns: minmax(180px, 0.45fr) minmax(220px, 0.55fr);
    align-items: center;
  }
  .ta-radar-head { grid-column: 1 / -1; }
  .ta-radar-orbit { min-height: 150px; }
}
@media (max-width: 760px) {
  .ta-mission-control { padding-top: 18px; }
  .ta-mc-grid,
  .ta-radar-card,
  .ta-mission-bottom {
    grid-template-columns: 1fr;
  }
  .ta-command-card,
  .ta-mission-card,
  .ta-radar-card,
  .ta-drill-builder,
  .ta-launch-band {
    border-radius: 14px;
  }
  .ta-command-card {
    min-height: 0;
    padding: 18px;
  }
  .ta-command-title {
    font-size: clamp(2rem, 11vw, 3rem);
  }
  .ta-status-stack {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .ta-status-pill {
    grid-template-columns: 1fr;
    gap: 4px;
    padding: 9px 8px;
  }
  .ta-status-pill span { font-size: 8px; }
  .ta-mission-card {
    min-height: 0;
    padding: 15px;
  }
  .ta-question-preview {
    padding: 14px;
  }
  .ta-options {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .ta-mission-bottom {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 12px;
  }
  .ta-mission-ring {
    width: 96px;
    height: 96px;
  }
  .ta-ring-core {
    width: 70px;
    height: 70px;
  }
  .ta-mission-score { font-size: 18px; }
  .ta-radar-orbit { min-height: 132px; }
  .ta-section-row,
  .ta-drill-head,
  .ta-launch-band {
    align-items: flex-start;
    flex-direction: column;
  }
  .ta-skill-row {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    grid-template-areas:
      "icon main cta"
      "icon progress progress"
      "icon meta meta";
    min-height: 0;
    padding: 12px 12px 12px 14px;
  }
  .ta-skill-icon { grid-area: icon; }
  .ta-skill-main { grid-area: main; }
  .ta-skill-progress { grid-area: progress; }
  .ta-skill-meta {
    grid-area: meta;
    display: flex;
    gap: 8px;
    align-items: center;
  }
  .ta-skill-cta { grid-area: cta; }
  .ta-drill-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .ta-drill-steps li {
    padding: 9px 8px;
  }
  .ta-launch-actions,
  .ta-command-actions {
    width: 100%;
  }
  .ta-launch-actions .btn,
  .ta-command-actions .btn,
  .ta-command-actions .ta-text-action {
    justify-content: center;
    flex: 1 1 auto;
  }
}
@media (max-width: 390px) {
  .ta-mission-card,
  .ta-command-card,
  .ta-radar-card,
  .ta-drill-builder,
  .ta-launch-band {
    padding: 14px;
  }
  .ta-heat-row {
    grid-template-columns: 76px minmax(0, 1fr) 34px;
  }
  .ta-status-stack {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .ta-status-pill strong {
    font-size: 13px;
  }
  .ta-mission-ring {
    width: 82px;
    height: 82px;
  }
  .ta-mission-bottom {
    grid-template-columns: 82px minmax(0, 1fr);
  }
  .ta-ring-core {
    width: 60px;
    height: 60px;
  }
  .ta-options button {
    padding: 8px 4px;
    font-size: 11px;
  }
  .ta-drill-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .ta-drill-steps li {
    padding: 8px 6px;
  }
}

/* Functional impact pass: stronger product surface, fewer brochure cues */
.ta-mission-page {
  --ta-ink: #071321;
  --ta-navy: #10233b;
  --ta-navy-deep: #071321;
  --ta-gold: #d8b45f;
  --ta-line: rgba(16,35,59,0.16);
  background:
    linear-gradient(180deg, #071321 0 360px, #eef3f8 360px 100%);
}
.ta-mission-control {
  border-bottom: 0;
  padding-top: clamp(18px, 3vw, 32px);
}
.ta-mc-grid {
  gap: 16px;
}
.ta-mc-grid > * {
  min-width: 0;
  box-sizing: border-box;
}
.ta-command-card,
.ta-mission-card,
.ta-radar-card {
  border-color: rgba(255,255,255,0.12);
  box-shadow: 0 26px 70px rgba(2,12,27,0.24);
}
.ta-command-card {
  background:
    linear-gradient(145deg, rgba(7,19,33,0.98), rgba(17,40,66,0.96)),
    repeating-linear-gradient(90deg, rgba(255,255,255,0.05) 0 1px, transparent 1px 18px);
  border-radius: 22px;
}
.ta-command-card::before {
  content: "";
  position: absolute;
  inset: 14px;
  border: 1px solid rgba(216,180,95,0.18);
  border-radius: 16px;
  pointer-events: none;
}
.ta-command-card::after {
  width: 210px;
  height: 210px;
  right: -80px;
  bottom: -74px;
  background: conic-gradient(from 90deg, rgba(216,180,95,0.55), transparent, rgba(47,109,179,0.34), transparent);
  filter: blur(1px);
}
.ta-command-title {
  margin-top: 18px;
  font-size: clamp(2.75rem, 4.7vw, 4.5rem);
  line-height: 0.84;
  text-transform: uppercase;
}
.ta-track-picker {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
  padding: 5px;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 14px;
  background: rgba(255,255,255,0.06);
}
.ta-track-picker button {
  min-height: 34px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  font-size: 11px;
}
.ta-track-picker button.is-active {
  background: #d8b45f;
  color: #071321;
  box-shadow: 0 10px 24px rgba(216,180,95,0.22);
}
.ta-control-board {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}
.ta-control-board div,
.ta-readiness-grid div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
  border-radius: 13px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
}
.ta-control-board span,
.ta-readiness-grid span {
  color: rgba(255,255,255,0.55);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.ta-control-board strong,
.ta-readiness-grid strong {
  color: #fff;
  font-size: 18px;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1;
}
.ta-status-stack {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.ta-status-pill {
  border-radius: 10px;
  background: rgba(216,180,95,0.11);
}
.ta-mission-card {
  min-height: 450px;
  border-radius: 22px;
  background:
    linear-gradient(180deg, #ffffff, #f7f9fc);
}
.ta-mission-card::before {
  background:
    radial-gradient(circle at 88% 12%, color-mix(in srgb, var(--mission-color) 32%, transparent), transparent 24%),
    linear-gradient(135deg, rgba(7,19,33,0.04) 0 1px, transparent 1px 18px);
}
.ta-question-preview {
  gap: 14px;
  padding: 18px;
  border-radius: 20px;
  background:
    linear-gradient(135deg, rgba(7,19,33,0.98), rgba(17,40,66,0.96)),
    radial-gradient(circle at 84% 18%, rgba(216,180,95,0.25), transparent 28%);
}
.ta-data-viz {
  display: grid;
  gap: 8px;
  padding: 10px;
  border-radius: 14px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.09);
}
.ta-data-viz div {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 48px;
  align-items: center;
  gap: 8px;
}
.ta-data-viz span {
  color: #fff;
  font-size: 13px;
  font-weight: 950;
}
.ta-data-viz b {
  height: 9px;
  border-radius: 99px;
  background: rgba(255,255,255,0.10);
  overflow: hidden;
}
.ta-data-viz i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #d8b45f, #72a8e8);
}
.ta-data-viz strong {
  color: rgba(255,255,255,0.58);
  font-size: 10px;
  font-weight: 900;
  text-align: right;
  text-transform: uppercase;
}
.ta-question-preview p {
  font-size: clamp(1.12rem, 2vw, 1.42rem);
}
.ta-options button {
  min-height: 42px;
  border-radius: 12px;
  font-size: 13px;
}
.ta-mission-bottom {
  grid-template-columns: 126px minmax(0, 1fr);
}
.ta-mission-ring {
  width: 126px;
  height: 126px;
  box-shadow: 0 18px 38px color-mix(in srgb, var(--mission-color) 20%, transparent);
}
.ta-ring-core {
  width: 88px;
  height: 88px;
}
.ta-radar-card {
  border-radius: 22px;
  background:
    linear-gradient(180deg, #0c1a2c, #132941);
  color: #fff;
}
.ta-radar-head strong {
  color: #fff;
}
.ta-radar-orbit {
  min-height: 180px;
  border-color: rgba(255,255,255,0.10);
  background:
    radial-gradient(circle at 50% 50%, rgba(216,180,95,0.28) 0 2px, transparent 3px),
    repeating-radial-gradient(circle at 50% 50%, transparent 0 32px, rgba(255,255,255,0.09) 33px 34px),
    linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03));
}
.ta-orbit-core {
  background: #d8b45f;
  color: #071321;
}
.ta-heat-row {
  color: rgba(255,255,255,0.66);
}
.ta-heat-row b {
  background: rgba(255,255,255,0.12);
}
.ta-heat-row strong,
.ta-heat-row.is-weak span,
.ta-heat-row.is-weak strong {
  color: #fff;
}
.ta-readiness-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.ta-readiness-grid div {
  background: rgba(255,255,255,0.07);
}
.ta-readiness-grid strong {
  font-size: 14px;
}
.ta-skill-map-section,
.ta-drill-section,
.ta-next-section {
  background: #eef3f8;
}
.ta-section-row {
  padding-top: 6px;
}
.ta-skill-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.ta-skill-item {
  min-width: 0;
}
.ta-skill-row {
  min-height: 110px;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  grid-template-areas:
    "icon main cta"
    "icon progress progress"
    "icon meta meta";
  border-radius: 18px;
  background: #fff;
}
.ta-skill-row::after {
  content: "";
  position: absolute;
  right: -38px;
  top: -44px;
  width: 116px;
  height: 116px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--skill-color) 13%, transparent);
}
.ta-skill-icon { grid-area: icon; }
.ta-skill-main { grid-area: main; }
.ta-skill-progress { grid-area: progress; }
.ta-skill-meta {
  grid-area: meta;
  display: flex;
  align-items: center;
  gap: 8px;
}
.ta-skill-cta {
  grid-area: cta;
  position: relative;
  z-index: 1;
  display: inline-grid;
  place-items: center;
  min-height: 32px;
  padding: 0 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--skill-color) 12%, #fff);
}
.ta-drill-builder,
.ta-launch-band {
  border: 0;
  background: #fff;
  box-shadow: 0 18px 42px rgba(16,35,59,0.09);
}
.ta-drill-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.ta-mode-tabs,
.ta-duration-tabs {
  display: inline-grid;
  gap: 4px;
  padding: 4px;
  border-radius: 13px;
  background: #e7edf4;
}
.ta-mode-tabs {
  grid-template-columns: repeat(3, minmax(62px, 1fr));
}
.ta-mode-tabs button,
.ta-duration-tabs button {
  height: 34px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #526177;
  font-size: 12px;
  font-weight: 950;
  cursor: pointer;
}
.ta-mode-tabs button.is-active,
.ta-duration-tabs button.is-active {
  background: #10233b;
  color: #fff;
  box-shadow: 0 9px 18px rgba(16,35,59,0.18);
}
.ta-drill-steps li {
  min-height: 84px;
  border: 0;
  background:
    linear-gradient(135deg, #f8fafc, #eef3f8);
  box-shadow: inset 0 0 0 1px rgba(16,35,59,0.08);
}
@media (max-width: 1100px) {
  .ta-mission-page {
    background: linear-gradient(180deg, #071321 0 520px, #eef3f8 520px 100%);
  }
  .ta-radar-card {
    grid-template-columns: minmax(180px, 0.42fr) minmax(220px, 0.58fr);
  }
  .ta-readiness-grid {
    grid-column: 1 / -1;
  }
}
@media (max-width: 760px) {
  .ta-mission-page {
    background: linear-gradient(180deg, #071321 0 760px, #eef3f8 760px 100%);
  }
  .ta-mc-grid {
    gap: 12px;
  }
  .ta-command-title {
    font-size: clamp(2.35rem, 13.5vw, 3.35rem);
  }
  .ta-track-picker {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .ta-track-picker button {
    font-size: 10px;
    min-height: 32px;
  }
  .ta-control-board {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .ta-control-board div {
    padding: 8px 6px;
  }
  .ta-control-board strong {
    font-size: 13px;
  }
  .ta-mission-bottom {
    grid-template-columns: 102px minmax(0, 1fr);
  }
  .ta-mission-ring {
    width: 102px;
    height: 102px;
  }
  .ta-ring-core {
    width: 72px;
    height: 72px;
  }
  .ta-radar-card {
    background: linear-gradient(180deg, #0c1a2c, #132941);
  }
  .ta-skill-list {
    grid-template-columns: 1fr;
  }
  .ta-skill-row {
    min-height: 92px;
  }
  .ta-drill-head,
  .ta-drill-controls {
    align-items: stretch;
    width: 100%;
  }
  .ta-mode-tabs,
  .ta-duration-tabs {
    width: 100%;
  }
  .ta-mode-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 390px) {
  .ta-control-board strong,
  .ta-readiness-grid strong {
    font-size: 12px;
  }
  .ta-data-viz div {
    grid-template-columns: 34px minmax(0, 1fr) 42px;
  }
  .ta-mission-bottom {
    grid-template-columns: 88px minmax(0, 1fr);
  }
  .ta-mission-ring {
    width: 88px;
    height: 88px;
  }
}

.ta-offer-page {
  --ta-page-bg: #f5f7fa;
  --ta-panel: #ffffff;
  --ta-panel-soft: #eef1f6;
  --ta-ink: #1a2940;
  --ta-text: #1a2c42;
  --ta-muted: #4a5a73;
  --ta-subtle: #8fa0b5;
  --ta-border: #dde3ec;
  --ta-border-light: #edf0f5;
  --ta-navy: #273e57;
  --ta-gold: #c6a354;
  --ta-gold-dark: #a8853c;
  min-height: 70vh;
  background:
    linear-gradient(rgba(221,227,236,0.42) 1px, transparent 1px),
    linear-gradient(90deg, rgba(221,227,236,0.42) 1px, transparent 1px),
    linear-gradient(180deg, #f5f7fa 0%, #ffffff 54%, #f5f7fa 100%);
  background-size: 48px 48px, 48px 48px, auto;
  color: var(--ta-text);
}

.ta-training-hero {
  padding: 54px 0 36px;
  overflow: hidden;
}

.ta-training-shell {
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(520px, 1.14fr);
  gap: 48px;
  align-items: center;
  margin-bottom: 34px;
}

.ta-training-copy {
  min-width: 0;
}

.ta-training-copy .ta-section-title {
  max-width: 720px;
  margin: 0;
  color: var(--ta-ink);
  font-family: var(--font-display, "Space Grotesk", "Manrope", system-ui, sans-serif);
  font-size: 4rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.03;
}

.ta-training-lead {
  max-width: 620px;
  margin: 22px 0 0;
  color: var(--ta-muted);
  font-size: 1.125rem;
  line-height: 1.75;
}

.ta-status-row {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 22px;
  color: var(--ta-ink);
  font-size: 0.95rem;
  font-weight: 750;
}

.ta-status-row span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.ta-status-row span + span {
  padding-left: 18px;
  border-left: 1px solid var(--ta-border);
}

.ta-status-row svg,
.ta-offer-meta svg,
.ta-course-info-btn svg,
.ta-pro-benefits svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ta-hero-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.ta-hero-actions .btn,
.ta-pro-action .btn {
  min-height: 52px;
  border-radius: var(--radius-sm, 8px);
  font-size: 0.95rem;
  font-weight: 800;
}

.ta-hero-actions .btn-primary,
.ta-pro-action .btn-primary {
  border-color: transparent !important;
  background: linear-gradient(135deg, var(--ta-gold), var(--ta-gold-dark)) !important;
  color: #141922 !important;
  box-shadow: 0 10px 22px rgba(198,163,84,0.24);
}

.ta-hero-actions .btn-ghost {
  border: 1px solid rgba(198,163,84,0.8);
  background: #ffffff;
  color: var(--ta-ink);
}

.ta-hero-actions .btn-ghost:hover {
  border-color: var(--ta-gold-dark);
  background: #fdf8ee;
}

.ta-path-panel {
  min-width: 0;
  padding: 32px 28px;
  border: 1px solid var(--ta-border);
  border-radius: var(--radius-lg, 16px);
  background: rgba(255,255,255,0.88);
  box-shadow: 0 18px 50px rgba(40,60,89,0.09);
}

.ta-path-rail {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ta-path-rail::before {
  content: "";
  position: absolute;
  top: 31px;
  left: 10%;
  right: 10%;
  height: 2px;
  background: linear-gradient(90deg, var(--ta-gold) 0 22%, var(--ta-border) 22% 100%);
}

.ta-path-rail li {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  align-content: start;
  gap: 8px;
  min-width: 0;
  text-align: center;
}

.ta-path-icon {
  display: grid;
  place-items: center;
  width: 62px;
  height: 62px;
  border: 1px dashed #c5d4e3;
  border-radius: 999px;
  background: #eef3fa;
  color: var(--ta-navy);
  box-shadow: inset 0 0 0 7px #f5f8fd;
}

.ta-path-rail .is-current .ta-path-icon {
  border-color: var(--ta-gold);
  border-style: solid;
  background: var(--ta-gold);
  color: #ffffff;
  box-shadow: 0 10px 22px rgba(198,163,84,0.22);
}

.ta-path-icon svg,
.ta-offer-icon-svg svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ta-path-rail strong {
  color: var(--ta-ink);
  font-size: 1rem;
  font-weight: 850;
  line-height: 1.25;
}

.ta-path-rail span:last-child {
  max-width: 132px;
  color: var(--ta-muted);
  font-size: 0.8125rem;
  line-height: 1.45;
}

.ta-offer-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.ta-offer-card {
  --offer-accent: var(--ta-navy);
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 300px;
  padding: 22px;
  border: 1px solid var(--ta-border);
  border-radius: var(--radius-md, 12px);
  background: rgba(255,255,255,0.94);
  box-shadow: 0 12px 32px rgba(40,60,89,0.07);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.ta-offer-card:hover {
  border-color: rgba(39,62,87,0.26);
  box-shadow: 0 18px 40px rgba(40,60,89,0.11);
  transform: translateY(-2px);
}

.ta-offer-card-training {
  --offer-accent: var(--ta-navy);
}

.ta-offer-card-course {
  --offer-accent: var(--ta-navy);
}

.ta-offer-card-featured {
  --offer-accent: var(--ta-gold-dark);
  border-color: rgba(198,163,84,0.68);
  background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(253,248,238,0.9));
  box-shadow: 0 16px 40px rgba(168,133,60,0.14);
}

.ta-offer-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}

.ta-offer-type {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 0 10px;
  border-radius: var(--radius-sm, 8px);
  background: #e8f0f7;
  color: var(--ta-navy);
  font-size: 0.6875rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.ta-offer-card-featured .ta-offer-type {
  background: #fdf8ee;
  color: #8a671d;
}

.ta-offer-icon {
  display: inline-grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 1px solid #dce5f0;
  border-radius: var(--radius-sm, 8px);
  background: linear-gradient(135deg, #eef3fa, #ffffff);
  color: var(--offer-accent);
  font-size: 1.2rem;
  font-weight: 850;
  letter-spacing: 0;
  flex: 0 0 auto;
}

.ta-offer-card-featured .ta-offer-icon {
  border-color: rgba(198,163,84,0.42);
  background: linear-gradient(135deg, #fdf8ee, #ffffff);
}

.ta-offer-card h2 {
  min-height: 58px;
  margin: 0;
  color: var(--ta-ink);
  font-family: var(--font-display, "Space Grotesk", "Manrope", system-ui, sans-serif);
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.12;
}

.ta-offer-promise {
  min-height: 68px;
  margin: 12px 0 18px;
  color: var(--ta-muted);
  font-size: 0.92rem;
  line-height: 1.55;
}

.ta-offer-meta {
  display: grid;
  gap: 7px;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--ta-border-light);
}

.ta-offer-meta span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ta-ink);
  font-size: 0.82rem;
  font-weight: 750;
}

.ta-offer-meta svg {
  width: 15px;
  height: 15px;
  color: var(--ta-navy);
}

.ta-offer-info {
  display: grid;
  gap: 12px;
  margin-top: 15px;
  padding: 13px;
  border: 1px solid rgba(39,62,87,0.12);
  border-radius: var(--radius-sm, 8px);
  background: #f8fafc;
}

.ta-offer-card-featured .ta-offer-info {
  border-color: rgba(198,163,84,0.28);
  background: #fffaf0;
}

.ta-offer-info p {
  margin: 0;
  color: var(--ta-muted);
  font-size: 0.86rem;
  line-height: 1.55;
}

.ta-course-enter-btn {
  width: 100%;
  min-height: 43px;
  margin-top: 16px;
  border-radius: var(--radius-sm, 8px);
  font-size: 0.875rem;
  font-weight: 850;
}

.ta-course-enter-btn + .ta-course-info-btn {
  margin-top: 10px;
}

.ta-course-info-btn {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 43px;
  width: 100%;
  margin-top: 16px;
  padding: 0 14px;
  border: 1px solid rgba(39,62,87,0.28);
  border-radius: var(--radius-sm, 8px);
  background: #ffffff;
  color: var(--ta-ink);
  cursor: pointer;
  font-family: var(--font-body, "Manrope", system-ui, sans-serif);
  font-size: 0.875rem;
  font-weight: 850;
  line-height: 1.2;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease;
}

.ta-course-info-btn:hover,
.ta-course-info-btn[aria-expanded="true"] {
  border-color: var(--offer-accent);
  background: #f8fafc;
  color: var(--offer-accent);
}

.ta-course-info-btn svg {
  width: 17px;
  height: 17px;
  transition: transform 160ms ease;
}

.ta-course-info-btn[aria-expanded="true"] svg {
  transform: rotate(90deg);
}

body.ta-course-sheet-open {
  overflow: hidden;
}

.ta-course-sheet-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 16px 12px 0;
  background:
    linear-gradient(180deg, rgba(9,18,31,0.14), rgba(9,18,31,0.44)),
    rgba(9,18,31,0.32);
  backdrop-filter: blur(5px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 220ms ease;
}

.ta-course-sheet-backdrop[hidden] {
  display: none;
}

.ta-course-sheet-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

.ta-course-sheet {
  position: relative;
  width: min(1240px, 100%);
  max-height: min(95dvh, 980px);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid rgba(203,213,225,0.94);
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
  background: #f8fafc;
  box-shadow: 0 -22px 72px rgba(9,18,31,0.32), 0 -1px 0 rgba(255,255,255,0.82);
  color: var(--ta-text);
  transform: translateY(28px);
  transition: transform 240ms cubic-bezier(.22,1,.36,1);
}

.ta-course-sheet::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 50%;
  z-index: 4;
  width: 48px;
  height: 4px;
  border-radius: 999px;
  background: rgba(39,62,87,0.28);
  transform: translateX(-50%);
}

.ta-course-sheet-backdrop.is-open .ta-course-sheet {
  transform: translateY(0);
}

.ta-course-sheet:focus {
  outline: none;
}

.ta-course-sheet-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 18px 24px 12px;
  border-bottom: 1px solid rgba(203,213,225,0.82);
  background: rgba(255,255,255,0.96);
  color: var(--ta-ink);
  backdrop-filter: blur(14px);
}

.ta-course-sheet-eyebrow {
  display: none;
  align-items: center;
  min-height: 24px;
  margin-bottom: 7px;
  padding: 0 9px;
  border: 1px solid rgba(198,163,84,0.34);
  border-radius: var(--radius-sm, 8px);
  background: #fff8e8;
  color: #75591c;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.ta-course-sheet h2 {
  margin: 0;
  color: var(--ta-ink);
  font-family: var(--font-display, "Space Grotesk", "Manrope", system-ui, sans-serif);
  font-size: clamp(1.18rem, 1.8vw, 1.42rem);
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1.12;
}

.ta-course-sheet p {
  display: none;
  max-width: 900px;
  margin: 6px 0 0;
  color: #526174;
  font-size: 0.9rem;
  line-height: 1.42;
}

.ta-course-sheet-close {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(39,62,87,0.16);
  border-radius: var(--radius-sm, 8px);
  background: #ffffff;
  color: var(--ta-ink);
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease;
}

.ta-course-sheet-close:hover {
  border-color: rgba(39,62,87,0.32);
  background: #f1f5f9;
  color: var(--ta-navy);
  transform: translateY(-1px);
}

.ta-course-sheet-close:focus-visible,
.ta-outline-block summary:focus-visible {
  outline: 3px solid rgba(198,163,84,0.28);
  outline-offset: 3px;
}

.ta-course-sheet-close svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
}

.ta-course-sheet-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 24px;
  border-bottom: 1px solid rgba(203,213,225,0.78);
  background: #f8fafc;
}

.ta-course-sheet-meta span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(39,62,87,0.12);
  border-radius: 999px;
  background: #ffffff;
  color: var(--ta-ink);
  font-size: 0.78rem;
  font-weight: 850;
}

.ta-course-sheet-meta span::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #c6a354;
  box-shadow: 0 0 0 3px rgba(198,163,84,0.14);
}

.ta-course-sheet-content {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 14px 18px 26px;
  -webkit-overflow-scrolling: touch;
  scrollbar-color: rgba(39,62,87,0.42) rgba(221,227,236,0.6);
}

.ta-course-sheet-content.is-loading {
  color: var(--ta-muted);
  font-weight: 750;
}

.ta-outline-block {
  position: relative;
  border: 1px solid rgba(203,213,225,0.96);
  border-radius: 12px;
  background:
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  box-shadow: 0 10px 24px rgba(40,60,89,0.055);
  overflow: hidden;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.ta-outline-block::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  z-index: 1;
  width: 4px;
  background: #5f685d;
  opacity: 0.72;
}

.ta-outline-block[data-block-kind="intro"]::before {
  background: #c6a354;
}

.ta-outline-block + .ta-outline-block {
  margin-top: 10px;
}

.ta-outline-block[open] {
  border-color: rgba(95,104,93,0.42);
  box-shadow: 0 16px 36px rgba(40,60,89,0.1);
  transform: translateY(-1px);
}

.ta-outline-block[open]::before {
  opacity: 1;
  width: 6px;
}

.ta-outline-block summary {
  display: grid;
  grid-template-columns: minmax(86px, auto) minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  min-height: 52px;
  padding: 10px 14px 10px 18px;
  cursor: pointer;
  list-style: none;
  background:
    linear-gradient(90deg, rgba(95,104,93,0.055), transparent 40%),
    #ffffff;
  transition: background 160ms ease, color 160ms ease;
}

.ta-outline-block summary:hover {
  background:
    linear-gradient(90deg, rgba(198,163,84,0.08), transparent 46%),
    #f8fafc;
}

.ta-outline-block[open] summary {
  background:
    linear-gradient(90deg, rgba(198,163,84,0.12), rgba(255,255,255,0) 42%),
    #ffffff;
}

.ta-outline-block summary::-webkit-details-marker {
  display: none;
}

.ta-outline-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(39,62,87,0.08);
  border-radius: 9px;
  background:
    linear-gradient(180deg, #f8fafc, #eaf0f6);
  color: var(--ta-navy);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
  white-space: nowrap;
}

.ta-outline-block[data-block-kind="intro"] .ta-outline-label {
  background:
    linear-gradient(180deg, #fff8e8, #f5e8c7);
  color: #6f551f;
}

.ta-outline-block[open] .ta-outline-label {
  border-color: rgba(39,62,87,0.08);
  background:
    linear-gradient(180deg, #273e57, #1c2d43);
  color: #ffffff;
}

.ta-outline-block[data-block-kind="intro"][open] .ta-outline-label {
  background:
    linear-gradient(180deg, #d8bd79, #b8943d);
  color: #1f2937;
}

.ta-outline-title {
  min-width: 0;
  color: var(--ta-ink);
  font-size: 0.98rem;
  font-weight: 850;
  line-height: 1.25;
}

.ta-outline-duration {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(198,163,84,0.34);
  border-radius: 999px;
  background: #fff8e8;
  color: #836222;
  font-size: 0.76rem;
  font-weight: 900;
  white-space: nowrap;
}

.ta-outline-duration::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.62;
}

.ta-outline-block summary::after {
  content: "";
  justify-self: end;
  width: 10px;
  height: 10px;
  margin-right: 3px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  color: var(--ta-navy);
  transform: rotate(45deg);
  transition: transform 160ms ease, color 160ms ease;
}

.ta-outline-block[open] summary::after {
  transform: rotate(-135deg);
}

.ta-outline-body {
  margin: 0;
  padding: 12px 16px 16px 18px;
  border-top: 1px solid rgba(203,213,225,0.78);
  background:
    linear-gradient(180deg, rgba(248,250,252,0.82), #ffffff 22%);
  color: #334155;
  font-family: var(--font-body, "Manrope", system-ui, sans-serif);
  font-size: 0.875rem;
  line-height: 1.42;
}

.ta-outline-line,
.ta-outline-line-spacer {
  display: block;
}

.ta-outline-line-spacer {
  height: 6px;
}

.ta-outline-line {
  position: relative;
  margin: 2px 0;
  padding: 3px 6px;
  border-radius: 6px;
  color: #334155;
  overflow-wrap: anywhere;
  break-inside: avoid;
}

.ta-outline-line--numbered[data-depth="1"],
.ta-outline-line--numbered[data-depth="2"] {
  margin-top: 8px;
  background: #f4f7fb;
  color: #172033;
  font-weight: 850;
}

.ta-outline-line--numbered[data-depth="3"] {
  padding-left: 16px;
  color: #263548;
  font-weight: 620;
}

.ta-outline-line--numbered[data-depth="4"] {
  padding-left: 28px;
  color: #475569;
  font-weight: 520;
}

.ta-outline-line--area,
.ta-outline-line--case,
.ta-outline-line--meta {
  margin-top: 8px;
  background: #eef6f0;
  color: var(--ta-navy);
  font-weight: 900;
}

.ta-outline-line--meta {
  color: #5f685d;
}

.ta-outline-line--text {
  color: #526174;
}

@media (min-width: 980px) {
  .ta-outline-body {
    column-count: 2;
    column-gap: 22px;
  }
}

@media (max-width: 720px) {
  .ta-course-sheet-backdrop {
    padding: 6px 0 0;
  }

  .ta-course-sheet {
    width: 100%;
    max-height: calc(100dvh - 6px);
    border-radius: 16px 16px 0 0;
  }

  .ta-course-sheet-head {
    gap: 10px;
    padding: 16px 14px 9px;
  }

  .ta-course-sheet-meta,
  .ta-course-sheet-content {
    padding-left: 10px;
    padding-right: 10px;
  }

  .ta-course-sheet-meta {
    gap: 6px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .ta-course-sheet-meta span {
    min-height: 26px;
    padding: 0 8px;
    font-size: 0.74rem;
  }

  .ta-course-sheet h2 {
    font-size: 1.12rem;
  }

  .ta-course-sheet p {
    display: none;
  }

  .ta-course-sheet-close {
    width: 36px;
    height: 36px;
  }

  .ta-outline-block summary {
    grid-template-columns: minmax(0, 1fr) auto auto;
    min-height: 0;
    gap: 8px;
    padding: 10px 10px;
  }

  .ta-outline-label {
    width: max-content;
    grid-column: 1;
    grid-row: 1;
  }

  .ta-outline-duration {
    grid-column: 2;
    grid-row: 1;
  }

  .ta-outline-block summary::after {
    grid-column: 3;
    grid-row: 1;
  }

  .ta-outline-title {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .ta-outline-body {
    padding: 0 10px 13px;
    font-size: 0.84rem;
    line-height: 1.38;
  }

  .ta-outline-line {
    padding-right: 5px;
  }

  .ta-outline-line--numbered[data-depth="3"] {
    padding-left: 12px;
  }

  .ta-outline-line--numbered[data-depth="4"] {
    padding-left: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ta-course-sheet-backdrop,
  .ta-course-sheet,
  .ta-course-sheet-close,
  .ta-outline-block summary::after {
    transition: none !important;
  }
}

.ta-join-btn {
  width: max-content;
  min-height: 38px;
  border-radius: var(--radius-sm, 8px);
  font-size: 0.8125rem;
  font-weight: 850;
}

.ta-pro-strip {
  border-top: 1px solid var(--ta-border);
  background: #ffffff;
}

.ta-pro-inner {
  display: grid;
  grid-template-columns: minmax(210px, 0.62fr) minmax(0, 1.55fr) auto;
  gap: 28px;
  align-items: center;
  padding-top: 32px;
  padding-bottom: 34px;
}

.ta-pro-inner h2 {
  margin: 0;
  color: var(--ta-ink);
  font-family: var(--font-display, "Space Grotesk", "Manrope", system-ui, sans-serif);
  font-size: 1.85rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.12;
}

.ta-pro-benefits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ta-pro-benefits li {
  display: grid;
  gap: 4px;
  padding-left: 18px;
  border-left: 1px solid var(--ta-border);
}

.ta-pro-benefits strong {
  color: var(--ta-ink);
  font-size: 0.9rem;
  font-weight: 850;
}

.ta-pro-benefits span {
  color: var(--ta-muted);
  font-size: 0.8rem;
  line-height: 1.45;
}

.ta-pro-action {
  display: grid;
  justify-items: center;
  gap: 8px;
}

.ta-pro-action span {
  color: var(--ta-muted);
  font-size: 0.82rem;
}

@media (max-width: 1180px) {
  .ta-training-shell {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .ta-training-copy .ta-section-title {
    font-size: 3.45rem;
  }

  .ta-offer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ta-pro-inner {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 820px) {
  .ta-training-hero {
    padding-top: 38px;
  }

  .ta-training-copy .ta-section-title {
    font-size: 2.8rem;
  }

  .ta-training-lead {
    font-size: 1rem;
  }

  .ta-path-panel {
    padding: 20px 16px;
  }

  .ta-path-rail {
    grid-template-columns: repeat(5, minmax(96px, 1fr));
    gap: 12px;
  }

  .ta-offer-grid,
  .ta-pro-benefits {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}

@media (max-width: 600px) {
  .ta-offer-page {
    background-size: 36px 36px, 36px 36px, auto;
  }

  .ta-training-copy .ta-section-title {
    font-size: 2.25rem;
    line-height: 1.08;
  }

  .ta-status-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .ta-status-row span + span {
    padding-left: 0;
    border-left: 0;
  }

  .ta-hero-actions .btn,
  .ta-pro-action .btn {
    width: 100%;
    justify-content: center;
  }

  .ta-offer-grid,
  .ta-pro-benefits {
    grid-template-columns: 1fr;
  }

  .ta-offer-card {
    min-height: 0;
  }

  .ta-offer-card h2,
  .ta-offer-promise {
    min-height: 0;
  }
  .ta-path-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 10px;
  }

  .ta-path-rail::before {
    display: none;
  }

  .ta-path-rail li:last-child {
    grid-column: 1 / -1;
  }

  .ta-path-icon {
    width: 54px;
    height: 54px;
  }

  .ta-path-rail span:last-child {
    max-width: none;
  }

  .ta-pro-benefits li {
    padding-left: 0;
    padding-top: 12px;
    border-left: 0;
    border-top: 1px solid var(--ta-border);
  }
}

/* Academy premium redesign */
.ta-academy-page {
  --academy-bg: #f6f8fb;
  --academy-ink: #061636;
  --academy-blue: #062a72;
  --academy-blue-strong: #0056d6;
  --academy-gold: #bc8a31;
  --academy-gold-soft: #d0a354;
  --academy-green: #08746f;
  --academy-text: #182844;
  --academy-muted: #5b6a80;
  --academy-border: rgba(21, 42, 76, 0.14);
  --academy-border-strong: rgba(21, 42, 76, 0.22);
  --academy-panel: rgba(255, 255, 255, 0.92);
  --academy-shadow: 0 22px 52px rgba(19, 37, 68, 0.13);
  --academy-shadow-soft: 0 14px 34px rgba(19, 37, 68, 0.09);
  min-height: 70vh;
  overflow-x: clip;
  background:
    radial-gradient(circle at 78% 9%, rgba(6, 42, 114, 0.055), transparent 24rem),
    radial-gradient(circle at 19% 22%, rgba(188, 138, 49, 0.085), transparent 21rem),
    linear-gradient(180deg, #fbfcfe 0%, #f5f7fb 42%, #ffffff 100%);
  color: var(--academy-text);
}

.ta-academy-page .container {
  width: min(100% - 48px, 1320px);
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

.ta-academy-page #academy-courses,
.ta-academy-page #academy-platforms {
  scroll-margin-top: calc(var(--nav-h, 64px) + 18px);
}

.ta-academy-page svg {
  width: 1em;
  height: 1em;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ta-academy-hero {
  position: relative;
  isolation: isolate;
  padding: calc(var(--nav-h, 64px) + 34px) 0 46px;
}

.ta-academy-hero::before {
  content: "";
  position: absolute;
  inset: -8px 0 auto auto;
  z-index: 0;
  width: min(62vw, 880px);
  height: 560px;
  background:
    linear-gradient(90deg, #f9fbfd 0%, rgba(249, 251, 253, 0.54) 15%, rgba(249, 251, 253, 0.08) 36%, rgba(249, 251, 253, 0) 62%),
    linear-gradient(180deg, rgba(249, 251, 253, 0) 0%, rgba(246, 248, 251, 0.01) 74%, #f6f8fb 100%),
    url("assets/training/eu-institution-backdrop.jpg") right top / cover no-repeat;
  opacity: 0.38;
  filter: saturate(1.02) contrast(1.02);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 100%);
}

.ta-academy-hero::after {
  content: "";
  position: absolute;
  inset: 0 0 auto auto;
  z-index: 0;
  width: min(52vw, 760px);
  height: 400px;
  background:
    linear-gradient(135deg, transparent 0 42%, rgba(6, 42, 114, 0.045) 42% 43%, transparent 43% 100%),
    radial-gradient(circle at 68% 20%, rgba(188, 138, 49, 0.08), transparent 6rem);
  clip-path: polygon(18% 0, 100% 0, 100% 100%, 0 100%);
  pointer-events: none;
}

.ta-academy-hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(560px, 1fr);
  gap: clamp(34px, 4.5vw, 72px);
  align-items: center;
}

.ta-academy-copy {
  min-width: 0;
  padding: 26px 0 8px;
}

.ta-academy-copy h1 {
  max-width: 720px;
  margin: 0;
  color: var(--academy-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(3.2rem, 4.6vw, 4.35rem);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.02;
}

.ta-academy-copy h1 span {
  display: inline;
  color: var(--academy-gold);
}

.ta-academy-copy p {
  max-width: 590px;
  margin: 20px 0 0;
  color: #15233d;
  font-size: clamp(0.98rem, 1.2vw, 1.13rem);
  font-weight: 520;
  line-height: 1.55;
}

.ta-academy-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.ta-academy-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 48px;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 0 24px;
  font: 800 0.94rem/1 "Manrope", Inter, system-ui, sans-serif;
  text-decoration: none;
  cursor: pointer;
  transition: transform 170ms ease, box-shadow 170ms ease, border-color 170ms ease, background 170ms ease;
}

.ta-academy-btn:hover {
  transform: translateY(-1px);
}

.ta-academy-btn:focus-visible,
.ta-courses-all:focus-visible,
.ta-course-tile a:focus-visible,
.ta-course-tile button:focus-visible,
.ta-platform-preview button:focus-visible {
  outline: 3px solid rgba(0, 86, 214, 0.22);
  outline-offset: 3px;
}

.ta-academy-btn-primary {
  background: linear-gradient(180deg, #082f7d, #052566);
  color: #ffffff;
  box-shadow: 0 10px 22px rgba(6, 42, 114, 0.2);
}

.ta-academy-btn-primary:hover {
  color: #ffffff;
  box-shadow: 0 14px 28px rgba(6, 42, 114, 0.25);
}

.ta-academy-btn-secondary {
  border-color: rgba(6, 42, 114, 0.25);
  background: rgba(255, 255, 255, 0.78);
  color: var(--academy-blue);
}

.ta-academy-btn-secondary:hover {
  border-color: rgba(6, 42, 114, 0.42);
  background: #ffffff;
  color: var(--academy-blue);
}

.ta-academy-proof {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  max-width: 720px;
  margin: 42px 0 0;
  border: 1px solid rgba(21, 42, 76, 0.09);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 12px 30px rgba(19, 37, 68, 0.055);
  backdrop-filter: blur(10px);
  overflow: hidden;
}

.ta-academy-proof div {
  min-width: 0;
  padding: 17px 18px 16px;
  border-left: 1px solid rgba(21, 42, 76, 0.16);
}

.ta-academy-proof div:first-child {
  border-left: 0;
}

.ta-academy-proof dt {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  margin: 0;
  color: var(--academy-ink);
  font-size: 0.74rem;
  font-weight: 850;
  line-height: 1.22;
}

.ta-academy-proof dt svg {
  box-sizing: content-box;
  width: 18px;
  height: 18px;
  padding: 7px;
  border-radius: 8px;
  background: rgba(6, 42, 114, 0.065);
  color: var(--academy-blue);
  flex: 0 0 auto;
}

.ta-academy-proof dd {
  margin: 9px 0 0 42px;
  color: var(--academy-muted);
  font-size: 0.7rem;
  line-height: 1.43;
}

.ta-academy-product {
  position: relative;
  min-width: 0;
  min-height: 350px;
  perspective: 1200px;
  z-index: 0;
  background:
    linear-gradient(90deg, rgba(249, 251, 253, 0) 0%, rgba(249, 251, 253, 0.04) 52%, rgba(249, 251, 253, 0.18) 100%);
}

.ta-academy-product::before {
  content: "";
  position: absolute;
  inset: -20px -12px auto auto;
  width: 88%;
  height: 104%;
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(6, 42, 114, 0.03), transparent 52%),
    linear-gradient(90deg, transparent 0 58%, rgba(188, 138, 49, 0.1) 58% 60%, transparent 60% 100%);
  opacity: 0.5;
  transform: translate(8px, 4px) skewX(-8deg);
}

.ta-academy-product::after {
  content: "";
  position: absolute;
  top: -28px;
  right: -92px;
  z-index: 0;
  width: 540px;
  height: 430px;
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(249, 251, 253, 0.04), rgba(249, 251, 253, 0) 20%),
    linear-gradient(180deg, rgba(249, 251, 253, 0), rgba(246, 248, 251, 0.04) 88%, #f6f8fb);
  opacity: 0.24;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 16%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 16%, #000 100%);
}

.ta-academy-tablet {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  width: min(100%, 590px);
  min-height: 322px;
  margin: 0 104px 0 auto;
  border: 4px solid #101724;
  border-radius: 14px;
  background: #f9fbfe;
  box-shadow: 0 28px 70px rgba(14, 25, 45, 0.25);
  overflow: hidden;
  transform: rotateX(3deg) rotateY(-5deg) rotateZ(2deg);
  transform-origin: center;
}

.ta-tablet-rail {
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 17px;
  background: linear-gradient(180deg, #06183a, #062a72 58%, #041b4f);
}

.ta-tablet-rail span {
  width: 15px;
  height: 15px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.92);
}

.ta-tablet-screen {
  display: grid;
  gap: 11px;
  padding: 22px 24px 20px;
  background:
    radial-gradient(circle at 94% 0%, rgba(6, 42, 114, 0.08), transparent 13rem),
    #fbfdff;
}

.ta-tablet-screen header {
  display: grid;
  gap: 7px;
}

.ta-tablet-screen header strong {
  color: #0a1831;
  font-size: 1rem;
  font-weight: 860;
}

.ta-tablet-screen header span,
.ta-tablet-training h2,
.ta-tablet-activity h2 {
  color: #182844;
  font-size: 0.72rem;
  font-weight: 850;
}

.ta-tablet-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.ta-tablet-stats div,
.ta-tablet-training article,
.ta-tablet-activity {
  border: 1px solid rgba(21, 42, 76, 0.09);
  border-radius: 7px;
  background: #ffffff;
  box-shadow: 0 8px 20px rgba(19, 37, 68, 0.06);
}

.ta-tablet-stats div {
  display: grid;
  gap: 7px;
  min-height: 62px;
  padding: 10px;
}

.ta-tablet-stats span {
  color: var(--academy-muted);
  font-size: 0.63rem;
  font-weight: 750;
}

.ta-tablet-stats strong {
  color: var(--academy-ink);
  font-size: 0.86rem;
  font-weight: 900;
}

.ta-tablet-training {
  display: grid;
  gap: 9px;
}

.ta-tablet-training > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.ta-tablet-training article {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px 10px;
  padding: 10px;
}

.ta-tablet-training article span {
  color: var(--academy-blue);
  font-size: 0.72rem;
  font-weight: 850;
}

.ta-tablet-training article strong {
  color: var(--academy-ink);
  font-size: 1rem;
  font-weight: 900;
}

.ta-tablet-training i {
  grid-column: 1 / -1;
  height: 7px;
  border-radius: 99px;
  background: #e8edf5;
  overflow: hidden;
}

.ta-tablet-training b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0fa46b, var(--academy-blue-strong));
}

.ta-tablet-training em {
  justify-self: start;
  min-width: 86px;
  border-radius: 4px;
  background: var(--academy-blue);
  color: #ffffff;
  padding: 7px 11px;
  font-size: 0.67rem;
  font-style: normal;
  font-weight: 850;
  text-align: center;
}

.ta-tablet-activity {
  display: grid;
  gap: 7px;
  padding: 10px;
}

.ta-tablet-activity p {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  margin: 0;
  color: #263a57;
  font-size: 0.7rem;
}

.ta-tablet-activity strong {
  color: var(--academy-ink);
}

.ta-tablet-activity em {
  color: var(--academy-muted);
  font-style: normal;
}

.ta-platform-section {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 10px 0 64px;
}

.ta-platform-heading {
  grid-column: 1 / -1;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin: 0 0 2px;
  padding: 0 18px;
}

.ta-platform-heading h2 {
  max-width: 680px;
  margin: 0;
  color: var(--academy-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.9rem, 2.4vw, 2.35rem);
  font-weight: 700;
  line-height: 1.08;
}

.ta-platform-heading p {
  max-width: 420px;
  margin: 0 0 4px;
  color: var(--academy-muted);
  font-size: 0.94rem;
  font-weight: 650;
  line-height: 1.45;
  text-align: right;
}

.ta-platform-card {
  --platform-accent: var(--academy-blue);
  --platform-accent-strong: var(--academy-blue-strong);
  --platform-soft: rgba(0, 86, 214, 0.08);
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(236px, 0.76fr);
  gap: 16px;
  min-width: 0;
  border: 1px solid var(--academy-border);
  border-radius: 12px;
  background:
    radial-gradient(circle at 100% 0%, var(--platform-soft), transparent 14rem),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9));
  box-shadow: var(--academy-shadow-soft);
  padding: 28px 16px 16px;
  overflow: hidden;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.ta-platform-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, var(--platform-accent), var(--platform-accent-strong));
}

.ta-platform-card::after {
  content: "";
  position: absolute;
  right: -72px;
  bottom: -120px;
  width: 220px;
  height: 220px;
  border-radius: 999px;
  background: var(--platform-soft);
  pointer-events: none;
}

.ta-platform-card:hover {
  transform: translateY(-2px);
  border-color: rgba(21, 42, 76, 0.2);
  box-shadow: 0 18px 42px rgba(19, 37, 68, 0.12);
}

.ta-platform-card-numerical {
  --platform-accent: var(--academy-green);
  --platform-accent-strong: #0c9f86;
  --platform-soft: rgba(8, 116, 111, 0.1);
}

.ta-platform-content {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 0 14px;
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
}

.ta-platform-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: linear-gradient(180deg, var(--platform-accent-strong), var(--platform-accent));
  color: #ffffff;
  font: 900 1.45rem/1 "Space Grotesk", "Manrope", system-ui, sans-serif;
  box-shadow: 0 10px 24px rgba(6, 42, 114, 0.18);
}

.ta-platform-card-numerical .ta-platform-icon {
  font-size: 1.16rem;
  box-shadow: 0 10px 24px rgba(8, 116, 111, 0.18);
}

.ta-platform-label {
  margin: 0 0 4px;
  color: var(--platform-accent-strong);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.ta-platform-content h2 {
  margin: 0;
  color: var(--academy-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.14rem, 1.25vw, 1.26rem);
  font-weight: 700;
  line-height: 1.12;
}

.ta-platform-text {
  margin: 7px 0 0;
  color: #233652;
  font-size: 0.84rem;
  line-height: 1.45;
}

.ta-platform-list {
  grid-column: 1 / -1;
  display: grid;
  gap: 5px;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

.ta-platform-list li {
  position: relative;
  padding-left: 24px;
  color: #233652;
  font-size: 0.78rem;
  line-height: 1.35;
}

.ta-platform-list li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 0.32em;
  width: 10px;
  height: 6px;
  border: solid var(--platform-accent);
  border-width: 0 0 1.8px 1.8px;
  transform: rotate(-45deg);
}

.ta-platform-stats {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 11px 0 0;
  border-top: 1px solid rgba(21, 42, 76, 0.12);
  border-bottom: 1px solid rgba(21, 42, 76, 0.12);
  background: rgba(248, 250, 253, 0.68);
}

.ta-platform-stats div {
  min-width: 0;
  padding: 7px 8px;
  border-left: 1px solid rgba(21, 42, 76, 0.12);
}

.ta-platform-stats div:first-child {
  border-left: 0;
  padding-left: 0;
}

.ta-platform-stats dt {
  margin: 0;
  color: var(--academy-ink);
  font-size: 0.8rem;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.ta-platform-stats dd {
  margin: 3px 0 0;
  color: var(--academy-muted);
  font-size: 0.62rem;
  line-height: 1.25;
}

.ta-platform-card > .ta-academy-btn {
  position: relative;
  z-index: 1;
  grid-column: 1;
  grid-row: 2;
  width: 100%;
  min-height: 40px;
  margin-top: 12px;
}

.ta-platform-card > .ta-academy-btn:focus-visible,
.ta-course-tile a:focus-visible,
.ta-course-tile button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--platform-accent, var(--course-accent, var(--academy-blue))) 24%, transparent);
  outline-offset: 3px;
}

.ta-platform-card-numerical .ta-academy-btn-primary {
  background: linear-gradient(180deg, #0c9f86, #08746f);
  box-shadow: 0 10px 22px rgba(8, 116, 111, 0.18);
}

.ta-platform-preview {
  position: relative;
  z-index: 1;
  grid-column: 2;
  grid-row: 1 / 3;
  align-self: center;
  min-width: 0;
  border: 1px solid rgba(21, 42, 76, 0.11);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 253, 0.96));
  box-shadow: 0 12px 30px rgba(19, 37, 68, 0.08);
  padding: 12px;
}

.ta-preview-tabs {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin: -2px 0 8px;
  color: var(--academy-muted);
  font-size: 0.56rem;
  font-weight: 850;
}

.ta-preview-tabs span {
  position: relative;
  padding-bottom: 7px;
}

.ta-preview-tabs .is-active {
  color: var(--platform-accent);
}

.ta-preview-tabs .is-active::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  border-radius: 999px;
  background: var(--platform-accent-strong);
}

.ta-platform-preview > strong {
  display: block;
  color: #13233f;
  font-size: 0.72rem;
  font-weight: 900;
}

.ta-reading-sample {
  height: 62px;
  margin-top: 8px;
  border-radius: 5px;
  background:
    linear-gradient(#d9e0ea 0 0) 10px 12px / 84% 4px no-repeat,
    linear-gradient(#e5eaf1 0 0) 10px 24px / 92% 4px no-repeat,
    linear-gradient(#e5eaf1 0 0) 10px 36px / 74% 4px no-repeat,
    linear-gradient(#d9e0ea 0 0) 10px 52px / 89% 4px no-repeat,
    linear-gradient(#e5eaf1 0 0) 10px 64px / 80% 4px no-repeat,
    linear-gradient(#e5eaf1 0 0) 10px 76px / 92% 4px no-repeat,
    #f8fafc;
  border: 1px solid rgba(21, 42, 76, 0.08);
}

.ta-chart-sample {
  display: flex;
  align-items: end;
  gap: 8px;
  height: 62px;
  margin: 8px 0 0;
  border-radius: 5px;
  background:
    repeating-linear-gradient(180deg, rgba(21, 42, 76, 0.08) 0 1px, transparent 1px 24px),
    #f8fafc;
  border: 1px solid rgba(21, 42, 76, 0.08);
  padding: 10px 16px;
}

.ta-chart-sample span {
  flex: 1;
  max-width: 24px;
  border-radius: 3px 3px 0 0;
  background: linear-gradient(180deg, var(--platform-accent-strong), var(--platform-accent));
}

.ta-platform-preview ol {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}

.ta-platform-preview li {
  border: 1px solid rgba(21, 42, 76, 0.1);
  border-radius: 5px;
  padding: 5px 8px;
  color: #253958;
  font-size: 0.68rem;
  font-weight: 760;
}

.ta-platform-preview button {
  display: block;
  width: min(110px, 100%);
  min-height: 28px;
  margin: 8px 0 0 auto;
  border: 0;
  border-radius: 4px;
  background: var(--platform-accent);
  color: #ffffff;
  font-size: 0.62rem;
  font-weight: 850;
}

.ta-guided-courses {
  position: relative;
  isolation: isolate;
  padding: 36px 0 56px;
}

.ta-guided-courses::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  border-top: 1px solid rgba(21, 42, 76, 0.06);
  border-bottom: 1px solid rgba(21, 42, 76, 0.06);
  background:
    linear-gradient(180deg, rgba(247, 249, 252, 0.82), rgba(255, 255, 255, 0.94));
}

.ta-courses-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin: 0 0 20px;
  padding: 0 18px;
}

.ta-courses-heading h2 {
  margin: 0;
  color: var(--academy-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2.05rem;
  font-weight: 700;
  line-height: 1.08;
}

.ta-courses-heading p {
  margin: 6px 0 0;
  color: var(--academy-muted);
  font-size: 0.94rem;
}

.ta-courses-all {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 34px;
  border: 1px solid rgba(6, 42, 114, 0.14);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.76);
  padding: 0 13px;
  color: var(--academy-blue);
  font-family: inherit;
  font-size: 0.82rem;
  font-weight: 850;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 8px 20px rgba(19, 37, 68, 0.055);
  cursor: pointer;
  transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.ta-courses-all:hover,
.ta-courses-all:focus-visible {
  border-color: rgba(6, 42, 114, 0.24);
  background: #ffffff;
  box-shadow: 0 12px 26px rgba(19, 37, 68, 0.08);
}

.ta-course-shelf {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  padding-inline: 18px;
}

.ta-course-tile {
  --course-accent: var(--academy-blue);
  --course-accent-strong: var(--academy-blue-strong);
  --course-soft: rgba(0, 86, 214, 0.08);
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 0 16px;
  align-content: start;
  min-width: 0;
  min-height: 188px;
  border: 1px solid var(--academy-border);
  border-radius: 12px;
  background:
    radial-gradient(circle at 100% 0%, var(--course-soft), transparent 10rem),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.92));
  box-shadow: 0 12px 30px rgba(19, 37, 68, 0.075);
  padding: 20px;
  overflow: hidden;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.ta-course-tile::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, var(--course-accent), var(--course-accent-strong));
}

.ta-course-tile::after {
  content: "";
  position: absolute;
  right: -44px;
  bottom: -70px;
  width: 130px;
  height: 130px;
  border-radius: 999px;
  background: var(--course-soft);
  pointer-events: none;
}

.ta-course-tile:hover {
  transform: translateY(-2px);
  border-color: rgba(21, 42, 76, 0.2);
  box-shadow: 0 18px 40px rgba(19, 37, 68, 0.11);
}

.ta-course-tile-abstract,
.ta-course-tile-eufte {
  --course-accent: #b77f24;
  --course-accent-strong: #d6a044;
  --course-soft: rgba(188, 138, 49, 0.12);
}

.ta-course-tile-eu {
  --course-accent: var(--academy-blue);
  --course-accent-strong: var(--academy-blue-strong);
  --course-soft: rgba(0, 86, 214, 0.09);
}

.ta-course-tile-digital {
  --course-accent: var(--academy-green);
  --course-accent-strong: #0c9f86;
  --course-soft: rgba(8, 116, 111, 0.1);
}

.ta-course-icon {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 10px;
  color: #ffffff;
  box-shadow: 0 10px 22px rgba(19, 37, 68, 0.12);
}

.ta-course-icon svg {
  width: 29px;
  height: 29px;
}

.ta-course-icon-gold {
  background: linear-gradient(180deg, #c9953a, #a97727);
}

.ta-course-icon-eu {
  background: linear-gradient(180deg, #082f7d, #052566);
}

.ta-course-icon-blue {
  background: linear-gradient(180deg, #0c9f86, #08746f);
}

.ta-course-copy {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.ta-course-title-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.ta-course-tile h3 {
  margin: 0;
  color: var(--academy-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.12rem;
  font-weight: 700;
  line-height: 1.16;
}

.ta-course-status {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  border: 1px solid color-mix(in srgb, var(--course-accent) 26%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--course-soft) 70%, #ffffff);
  padding: 0 9px;
  color: var(--course-accent);
  font-size: 0.66rem;
  font-weight: 880;
  line-height: 1;
  white-space: nowrap;
}

.ta-course-copy p {
  margin: 8px 0 0;
  color: #263a57;
  font-size: 0.84rem;
  line-height: 1.45;
  text-wrap: pretty;
}

.ta-course-footer {
  position: relative;
  z-index: 1;
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 20px;
  padding-top: 14px;
  border-top: 1px solid rgba(21, 42, 76, 0.1);
}

.ta-course-footer > span {
  color: var(--academy-muted);
  font-size: 0.78rem;
  font-weight: 780;
}

.ta-course-tile a,
.ta-course-tile button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  border: 1px solid color-mix(in srgb, var(--course-accent) 24%, transparent);
  border-radius: 6px;
  background: transparent;
  padding: 0 12px;
  color: var(--course-accent);
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 850;
  text-decoration: none;
  cursor: pointer;
}

.ta-course-tile a:hover,
.ta-course-tile button:hover,
.ta-course-tile a:focus-visible,
.ta-course-tile button:focus-visible {
  border-color: color-mix(in srgb, var(--course-accent) 42%, transparent);
  background: var(--course-soft);
  color: var(--course-accent);
}

@media (prefers-reduced-motion: reduce) {
  .ta-academy-btn,
  .ta-course-tile,
  .ta-platform-card {
    transition: none;
  }

  .ta-academy-btn:hover,
  .ta-course-tile:hover,
  .ta-platform-card:hover {
    transform: none;
  }
}

@media (max-width: 1180px) {
  .ta-academy-page .container {
    width: min(100% - 36px, 1040px);
  }

  .ta-academy-hero-grid {
    grid-template-columns: 1fr;
  }

  .ta-academy-copy {
    max-width: 820px;
  }

  .ta-academy-product {
    min-height: 300px;
  }

  .ta-academy-tablet {
    margin-inline: auto;
  }

  .ta-platform-section {
    grid-template-columns: 1fr;
  }

  .ta-platform-heading {
    align-items: start;
    flex-direction: column;
    gap: 8px;
  }

  .ta-platform-heading p {
    max-width: 620px;
    text-align: left;
  }

  .ta-platform-card {
    grid-template-columns: minmax(0, 1fr) minmax(270px, 0.76fr);
  }

  .ta-course-shelf {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  body.ta-academy-body .whatsapp-cta {
    display: none;
  }
}

@media (min-width: 761px) and (max-width: 900px) {
  .ta-academy-hero {
    padding: calc(var(--nav-h, 64px) + 30px) 0 42px;
  }

  .ta-academy-hero-grid {
    gap: 24px;
  }

  .ta-academy-copy {
    max-width: 720px;
    padding: 24px 0 0;
  }

  .ta-academy-copy h1 {
    max-width: 11em;
    font-size: clamp(3.4rem, 8vw, 4.1rem);
  }

  .ta-academy-copy p {
    max-width: 38em;
  }

  .ta-academy-proof {
    max-width: none;
  }

  .ta-academy-product {
    display: none;
  }
}

@media (max-width: 760px) {
  body.ta-academy-body .nav-actions {
    max-width: none;
    gap: 6px;
  }

  body.ta-academy-body .nav-actions > .btn.btn-primary[data-nav-free-simulator] {
    display: none !important;
  }

  body.ta-academy-body .whatsapp-cta {
    display: none;
  }

  .ta-academy-page .container {
    width: 100%;
  }

  .ta-academy-hero {
    padding: calc(var(--nav-h, 64px) + 28px) 16px 34px;
    background:
      linear-gradient(180deg, rgba(251, 252, 254, 0.9), rgba(247, 249, 252, 0.94));
  }

  .ta-academy-hero::before {
    inset: 0 0 auto auto;
    width: 100%;
    height: 340px;
    background:
      linear-gradient(90deg, #fbfcfe 0%, #fbfcfe 42%, rgba(251, 252, 254, 0.86) 70%, rgba(251, 252, 254, 0.42) 100%),
      linear-gradient(180deg, rgba(251, 252, 254, 0) 0%, #f7f9fc 100%),
      url("assets/training/eu-institution-backdrop.jpg") right top / auto 96% no-repeat;
    background-position: right top;
    opacity: 1;
    filter: saturate(1.02) contrast(1.02);
    -webkit-mask-image: none;
    mask-image: none;
  }

  .ta-academy-hero::after {
    width: 50%;
    height: 230px;
    opacity: 0.18;
  }

  .ta-academy-copy {
    padding-top: 0;
  }

  .ta-academy-copy h1 {
    max-width: 10.8em;
    font-size: 2.42rem;
    line-height: 1.04;
  }

  .ta-academy-copy p {
    max-width: 31em;
    font-size: 0.96rem;
  }

  .ta-academy-actions {
    display: grid;
    gap: 10px;
    margin-top: 20px;
  }

  .ta-academy-btn {
    width: 100%;
    min-height: 46px;
  }

  .ta-academy-proof,
  .ta-academy-product {
    display: none;
  }

  .ta-academy-page .ta-platform-section {
    gap: 14px;
    padding: 8px 16px 38px;
  }

  .ta-platform-heading {
    padding: 0;
  }

  .ta-platform-heading h2 {
    font-size: 1.55rem;
  }

  .ta-platform-heading p {
    font-size: 0.84rem;
  }

  .ta-platform-card {
    grid-template-columns: 1fr;
    padding: 26px 14px 14px;
  }

  .ta-platform-content {
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 0 14px;
  }

  .ta-platform-icon {
    width: 52px;
    height: 52px;
    font-size: 1.45rem;
  }

  .ta-platform-card-numerical .ta-platform-icon {
    font-size: 1.18rem;
  }

  .ta-platform-content h2 {
    font-size: 1.3rem;
  }

  .ta-platform-text {
    font-size: 0.88rem;
  }

  .ta-platform-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin-top: 13px;
  }

  .ta-platform-list li {
    padding-left: 18px;
    font-size: 0.73rem;
    line-height: 1.25;
  }

  .ta-platform-list li::before {
    left: 1px;
    top: 0.42em;
    width: 8px;
    height: 5px;
  }

  .ta-platform-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 10px;
  }

  .ta-platform-stats div {
    padding: 8px 6px;
  }

  .ta-platform-stats dt {
    font-size: 0.72rem;
  }

  .ta-platform-stats dd {
    font-size: 0.56rem;
  }

  .ta-platform-stats div:nth-child(3) {
    border-left: 1px solid rgba(21, 42, 76, 0.12);
  }

  .ta-platform-preview {
    grid-column: 1;
    grid-row: 2;
    align-self: stretch;
    display: block;
    margin-top: 12px;
    border-radius: 8px;
    padding: 9px;
    box-shadow: 0 10px 24px rgba(19, 37, 68, 0.06);
  }

  .ta-preview-tabs {
    justify-content: flex-start;
    gap: 10px;
    margin: -1px 0 5px;
    font-size: 0.54rem;
    white-space: nowrap;
  }

  .ta-preview-tabs span:not(.is-active) {
    display: none;
  }

  .ta-platform-preview > strong {
    font-size: 0.68rem;
  }

  .ta-reading-sample {
    height: 28px;
    margin-top: 6px;
    background:
      linear-gradient(#d9e0ea 0 0) 10px 8px / 82% 3px no-repeat,
      linear-gradient(#e5eaf1 0 0) 10px 17px / 92% 3px no-repeat,
      linear-gradient(#e5eaf1 0 0) 10px 26px / 70% 3px no-repeat,
      #f8fafc;
  }

  .ta-chart-sample {
    height: 28px;
    margin-top: 6px;
    gap: 8px;
    padding: 6px 12px;
  }

  .ta-platform-preview ol {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    margin-top: 6px;
  }

  .ta-platform-preview li {
    padding: 3px 5px;
    font-size: 0.58rem;
  }

  .ta-platform-preview button {
    display: none;
  }

  .ta-platform-card > .ta-academy-btn {
    grid-column: 1;
    grid-row: 3;
    margin-top: 12px;
  }

  .ta-academy-page .ta-guided-courses {
    padding: 20px 16px 30px;
  }

  .ta-courses-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 0;
  }

  .ta-courses-heading h2 {
    font-size: 1.55rem;
  }

  .ta-courses-all {
    min-height: 32px;
    padding-inline: 11px;
    font-size: 0.77rem;
  }

  .ta-course-shelf {
    grid-template-columns: 1fr;
    gap: 12px;
    padding-inline: 0;
  }

  .ta-course-tile {
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 0 14px;
    min-height: 0;
    padding: 16px;
  }

  .ta-course-icon {
    width: 46px;
    height: 46px;
    border-radius: 8px;
  }

  .ta-course-icon svg {
    width: 25px;
    height: 25px;
  }

  .ta-course-title-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .ta-course-status {
    justify-self: start;
  }

  .ta-course-copy p {
    font-size: 0.8rem;
  }

  .ta-course-footer {
    align-items: center;
    gap: 10px;
    margin-top: 12px;
  }
}

@media (max-width: 390px) {
  .ta-academy-copy h1 {
    font-size: 2.16rem;
  }

  .ta-platform-content {
    grid-template-columns: 1fr;
  }

  .ta-platform-icon {
    margin-bottom: 12px;
  }

  .ta-course-tile {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 0 12px;
  }

  .ta-course-footer {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (max-width: 340px) {
  .ta-platform-card {
    padding-inline: 12px;
  }

  .ta-platform-list {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .ta-platform-list li {
    font-size: 0.78rem;
  }

  .ta-platform-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ta-platform-stats div {
    padding: 9px 8px;
  }

  .ta-platform-stats div:nth-child(odd) {
    border-left: 0;
    padding-left: 0;
  }

  .ta-platform-stats div:nth-child(n + 3) {
    border-top: 1px solid rgba(21, 42, 76, 0.12);
  }

  .ta-platform-preview ol {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
  }

  .ta-platform-preview li {
    padding: 4px 6px;
    font-size: 0.62rem;
  }

  .ta-courses-heading {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .ta-courses-all {
    justify-self: start;
  }
}