/* =====================================================================
   The Training Co. — site chrome + homepage implementation
   Matches supplied design comps. Mobile-first with intentional breakpoints.
   ===================================================================== */

:root {
  --navy: #102B3A;
  --navy-2: #0C2231;
  --blue: #1777A8;
  --cta: #1468D5;
  --cta-dark: #1157B4;
  --soft: #F7F9F8;
  --lightblue: #EAF4FB;
  --ink: #172126;
  --muted: #5A6B75;
  --line: #E4EAEE;
  --white: #fff;
  --teal: #16A48C;
  --gold: #F5B301;

  --c-firstaid: #DC2A32;
  --c-safety: #1468D5;
  --c-food: #1E9E56;
  --c-mind: #7A3FA8;

  --r-sm: 8px;
  --r: 12px;
  --r-lg: 16px;
  --r-xl: 22px;
  --sh-sm: 0 1px 2px rgba(16,43,58,.06), 0 2px 8px rgba(16,43,58,.05);
  --sh: 0 2px 4px rgba(16,43,58,.05), 0 8px 24px rgba(16,43,58,.08);
  --sh-lg: 0 12px 40px rgba(16,43,58,.13);
  --ease: cubic-bezier(.22,1,.36,1);
  --shell: 1280px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--white); color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 16px; line-height: 1.6; overflow-x: hidden;
}
img, svg { max-width: 100%; display: block; }
img { height: auto; }
a { color: var(--cta); }
h1,h2,h3,h4 {
  font-family: "Plus Jakarta Sans", Inter, ui-sans-serif, system-ui, sans-serif;
  color: var(--navy); line-height: 1.18; letter-spacing: -.02em; margin: 0;
}
ul, ol { margin: 0; padding: 0; list-style: none; }
p { margin: 0 0 1rem; }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
legend { padding: 0; }

.screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(1px,1px,1px,1px); white-space: nowrap;
}
.ttc-skip-link:focus {
  position: fixed !important; top: .5rem; left: .5rem; z-index: 999; width: auto; height: auto;
  clip: auto; background: #fff; padding: .7rem 1.1rem; border-radius: var(--r); box-shadow: var(--sh);
}
:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid var(--cta); outline-offset: 2px; border-radius: 4px;
}

.ttc-shell { width: 100%; max-width: var(--shell); margin-inline: auto; padding-inline: 20px; }
.ttc-section { padding-block: clamp(48px, 6vw, 84px); }
.ttc-section--soft { background: var(--soft); }
.ttc-section--tight { padding-block: clamp(20px, 2.5vw, 34px); }
.ttc-center { text-align: center; }
.ttc-ico { flex: 0 0 auto; }

.ttc-h2 { font-size: clamp(1.6rem, 1.15rem + 2vw, 2.5rem); font-weight: 800; }
.ttc-h2--light { color: #fff; }
.ttc-accent { color: var(--cta); }
.ttc-sub { color: var(--muted); max-width: 62ch; margin-inline: auto; }
.ttc-center + .ttc-sub, .ttc-h2.ttc-center + .ttc-sub { margin-bottom: 2rem; }
.ttc-eyebrow {
  font-size: .78rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase;
  color: var(--blue); margin: 0 0 .55rem;
}
.ttc-eyebrow--light { color: #7FC4E8; }
.ttc-link {
  display: inline-flex; align-items: center; gap: .4rem;
  font-weight: 700; color: var(--cta); text-decoration: none;
}
.ttc-link:hover { text-decoration: underline; }

/* Image placeholder (until brand photography is supplied) */
.ttc-imgph {
  display: grid; place-items: center; width: 100%;
  background: linear-gradient(135deg, var(--lightblue), #DCE9F3);
  color: #6C8296; border-radius: inherit; font-size: .74rem; font-weight: 600;
  text-align: center; padding: .5rem; overflow: hidden;
}
.ttc-imgph__label { opacity: .85; }

/* ---------- Buttons ---------- */
.ttc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  font-family: inherit; font-size: .95rem; font-weight: 700; line-height: 1;
  padding: .95rem 1.5rem; border-radius: var(--r); border: 1.5px solid transparent;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background-color .18s var(--ease), color .18s, border-color .18s, transform .18s var(--ease), box-shadow .18s;
}
.ttc-btn--primary { background: var(--cta); color: #fff; box-shadow: 0 6px 16px rgba(20,104,213,.25); }
.ttc-btn--primary:hover { background: var(--cta-dark); transform: translateY(-1px); }
.ttc-btn--outline { background: #fff; color: var(--cta); border-color: #C7DBF3; }
.ttc-btn--outline:hover { border-color: var(--cta); background: var(--lightblue); }
.ttc-btn--onDark { background: transparent; color: #fff; border-color: rgba(255,255,255,.45); }
.ttc-btn--onDark:hover { background: rgba(255,255,255,.12); }
.ttc-btn--teal { background: var(--teal); color: #fff; }
.ttc-btn--teal:hover { background: #128A76; transform: translateY(-1px); }

/* ---------- Logo ---------- */
.ttc-logo {
  display: inline-flex; align-items: center; line-height: 0;
  text-decoration: none; flex: 0 0 auto;
}
.ttc-logo__img {
  display: block; width: auto; height: 48px; max-width: min(260px, 52vw);
  object-fit: contain;
}
.ttc-logo--light {
  background: #fff; border-radius: 10px; padding: .45rem .7rem;
  box-shadow: 0 1px 0 rgba(255,255,255,.08);
}
.ttc-logo--light .ttc-logo__img { height: 40px; }
@media (max-width: 620px) {
  .ttc-logo__img { height: 40px; }
}

/* ---------- Utility bar ---------- */
.ttc-utility { background: var(--navy); color: #C8D6DF; font-size: .82rem; }
.ttc-utility__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 40px; }
.ttc-utility__left { display: flex; gap: 1.6rem; flex-wrap: wrap; }
.ttc-utility__item { display: inline-flex; align-items: center; gap: .4rem; color: inherit; text-decoration: none; }
a.ttc-utility__item:hover { color: #fff; }
@media (max-width: 860px) { .ttc-utility__right { display: none; } .ttc-utility__left { gap: 1rem; } }
@media (max-width: 560px) { .ttc-utility { font-size: .75rem; } }

/* ---------- Header ---------- */
.ttc-header { position: sticky; top: 0; z-index: 60; background: #fff; border-bottom: 1px solid var(--line); }
.ttc-header__inner { display: flex; align-items: center; gap: 1.25rem; min-height: 76px; }
.ttc-nav { margin-left: auto; }
.ttc-nav__list { display: flex; align-items: center; gap: .25rem; }
.ttc-nav__item { position: relative; }
.ttc-nav__link {
  display: inline-flex; align-items: center; gap: .25rem; padding: .6rem .7rem;
  font-size: .93rem; font-weight: 600; color: var(--navy); text-decoration: none; border-radius: var(--r-sm);
}
.ttc-nav__link:hover { color: var(--cta); background: var(--lightblue); }
.ttc-nav__sub {
  position: absolute; top: 100%; left: 0; min-width: 226px; padding: .5rem;
  background: #fff; border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--sh-lg);
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .16s var(--ease), transform .16s var(--ease), visibility .16s;
}
.ttc-nav__item.has-children:hover .ttc-nav__sub,
.ttc-nav__item.has-children:focus-within .ttc-nav__sub { opacity: 1; visibility: visible; transform: none; }
.ttc-nav__sub a {
  display: block; padding: .55rem .7rem; font-size: .9rem; font-weight: 600;
  color: var(--navy); text-decoration: none; border-radius: var(--r-sm);
}
.ttc-nav__sub a:hover { background: var(--lightblue); color: var(--cta); }
.ttc-header__actions { display: flex; align-items: center; gap: .75rem; margin-left: auto; }
.ttc-header__phone { display: none; align-items: center; gap: .4rem; font-weight: 700; font-size: .9rem; color: var(--navy); text-decoration: none; }
.ttc-header__cta { padding: .8rem 1.3rem; }
.ttc-burger { display: none; padding: .5rem; background: none; border: 1px solid var(--line); border-radius: var(--r-sm); color: var(--navy); cursor: pointer; }

.ttc-mobilenav { display: none; border-top: 1px solid var(--line); background: #fff; padding: 1rem 20px 1.5rem; }
.ttc-mobilenav[hidden] { display: none !important; }
.ttc-mobilenav__list > li > a {
  display: block; padding: .8rem .25rem; font-weight: 700; color: var(--navy);
  text-decoration: none; border-bottom: 1px solid var(--line);
}
.ttc-mobilenav__list ul { padding: .25rem 0 .5rem .9rem; }
.ttc-mobilenav__list ul a { display: block; padding: .5rem .25rem; font-size: .92rem; color: var(--muted); text-decoration: none; }
.ttc-mobilenav__actions { display: grid; gap: .6rem; margin-top: 1rem; }

@media (max-width: 1180px) { .ttc-nav__link { padding: .55rem .5rem; font-size: .88rem; } }
@media (max-width: 1024px) {
  .ttc-nav { display: none; }
  .ttc-burger { display: inline-flex; }
  .ttc-mobilenav:not([hidden]) { display: block; }
  .ttc-header__inner { min-height: 68px; }
}
@media (max-width: 620px) { .ttc-header__cta { display: none; } }

/* ---------- Hero ---------- */
.ttc-hero { background: linear-gradient(180deg, #fff 0%, #F4F9FD 100%); overflow: hidden; }
.ttc-hero__grid {
  width: 100%; max-width: var(--shell); margin-inline: auto;
  display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(1.5rem, 3vw, 3rem);
  padding: clamp(2rem, 4vw, 4.5rem) 20px;
}
.ttc-hero__title { font-size: clamp(2rem, 1.2rem + 3.4vw, 3.4rem); font-weight: 800; margin-bottom: 1.1rem; }
.ttc-hero__lead { color: var(--muted); max-width: 46ch; font-size: 1.02rem; }
.ttc-hero__ctas { display: flex; flex-wrap: wrap; gap: .8rem; margin: 1.6rem 0 2rem; }
.ttc-hero__badges { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1rem; }
.ttc-hero__badges li { display: grid; gap: .5rem; }
.ttc-hero__badge-ico { color: var(--cta); }
.ttc-hero__badge-txt { font-size: .82rem; font-weight: 600; color: var(--navy); line-height: 1.35; }
.ttc-hero__media { position: relative; }
.ttc-hero__media > img, .ttc-hero__media > .ttc-imgph { border-radius: var(--r-xl); object-fit: cover; width: 100%; box-shadow: var(--sh-lg); }
.ttc-hero__card {
  position: absolute; right: -6px; bottom: -26px; display: flex; gap: .9rem; align-items: flex-start;
  max-width: 330px; padding: 1.1rem 1.25rem; background: #fff;
  border-radius: var(--r-lg); box-shadow: var(--sh-lg);
}
.ttc-hero__card-ico { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 auto; border-radius: 50%; background: #DFF3EE; color: var(--teal); }
.ttc-hero__card-sub { font-size: .84rem; color: var(--muted); margin: 0; }
.ttc-hero__card-title { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.3rem; font-weight: 800; color: var(--navy); margin: .1rem 0 .35rem; }
.ttc-hero__card-tags { font-size: .8rem; font-weight: 600; color: var(--cta); margin: 0; line-height: 1.5; }

@media (max-width: 900px) {
  .ttc-hero__grid { grid-template-columns: 1fr; }
  .ttc-hero__media { order: -1; }
  .ttc-hero__card { position: static; max-width: none; margin-top: 1rem; }
  .ttc-hero__lead { max-width: none; }
}
@media (max-width: 560px) { .ttc-hero__badges { grid-template-columns: repeat(2,1fr); } .ttc-hero__ctas .ttc-btn { flex: 1 1 100%; } }

/* ---------- Trust bar ---------- */
.ttc-trustbar__logos {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: clamp(1.5rem, 4vw, 3.5rem); margin: 2.2rem 0 1.6rem;
}
.ttc-trustbar__logos li { width: clamp(110px, 14vw, 165px); }
.ttc-trustbar__logo { width: 100%; object-fit: contain; filter: grayscale(1); opacity: .78; transition: filter .2s, opacity .2s; }
.ttc-trustbar__logos li:hover .ttc-trustbar__logo { filter: none; opacity: 1; }
.ttc-trustbar__note {
  display: flex; align-items: center; justify-content: center; gap: .55rem;
  color: var(--muted); font-size: .9rem; margin: 0;
}
.ttc-trustbar__note .ttc-ico { color: var(--blue); }

/* ---------- Category cards ---------- */
.ttc-cats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; margin-top: 2.2rem; }
.ttc-cat {
  display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line);
  border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-sm);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.ttc-cat:hover { transform: translateY(-4px); box-shadow: var(--sh-lg); }
.ttc-cat__media { position: relative; }
.ttc-cat__media img, .ttc-cat__media .ttc-imgph { width: 100%; object-fit: cover; border-radius: 0; }
.ttc-cat__icon {
  position: absolute; left: 18px; bottom: -22px; display: grid; place-items: center;
  width: 52px; height: 52px; border-radius: 50%; color: #fff; box-shadow: var(--sh);
}
.ttc-cat--firstaid .ttc-cat__icon { background: var(--c-firstaid); }
.ttc-cat--safety .ttc-cat__icon { background: var(--c-safety); }
.ttc-cat--food .ttc-cat__icon { background: var(--c-food); }
.ttc-cat--mind .ttc-cat__icon { background: var(--c-mind); }
.ttc-cat__body { display: flex; flex-direction: column; flex: 1; padding: 2.2rem 1.35rem 1.4rem; }
.ttc-cat__title { font-size: 1.3rem; font-weight: 800; margin-bottom: .5rem; }
.ttc-cat__desc { color: var(--muted); font-size: .93rem; }
.ttc-cat__list { display: grid; gap: .5rem; margin: .35rem 0 1.2rem; }
.ttc-cat__list li { display: flex; align-items: flex-start; gap: .5rem; font-size: .9rem; color: var(--ink); }
.ttc-cat--firstaid .ttc-cat__list .ttc-ico { color: var(--c-firstaid); }
.ttc-cat--safety .ttc-cat__list .ttc-ico { color: var(--c-safety); }
.ttc-cat--food .ttc-cat__list .ttc-ico { color: var(--c-food); }
.ttc-cat--mind .ttc-cat__list .ttc-ico { color: var(--c-mind); }
.ttc-cat__cta { display: inline-flex; align-items: center; gap: .45rem; margin-top: auto; font-weight: 700; font-size: .93rem; text-decoration: none; }
.ttc-cat--firstaid .ttc-cat__cta { color: var(--c-firstaid); }
.ttc-cat--safety .ttc-cat__cta { color: var(--c-safety); }
.ttc-cat--food .ttc-cat__cta { color: var(--c-food); }
.ttc-cat--mind .ttc-cat__cta { color: var(--c-mind); }
.ttc-cat__cta:hover { gap: .75rem; }

@media (max-width: 1100px) { .ttc-cats { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 600px) { .ttc-cats { grid-template-columns: 1fr; } }

/* ---------- Course finder ---------- */
.ttc-finder {
  display: grid; grid-template-columns: 1.35fr 1fr 1fr 1fr 1fr .95fr; gap: 0;
  background: var(--navy); border-radius: var(--r-xl); overflow: hidden; color: #fff;
}
.ttc-finder__intro { padding: 2rem 1.75rem; }
.ttc-finder__title { font-size: 1.5rem; font-weight: 800; color: #fff; margin-bottom: .6rem; }
.ttc-finder__lead { font-size: .88rem; color: #B4C6D2; margin-bottom: .6rem; }
.ttc-finder__lead a { color: #6FB6E8; font-weight: 700; text-decoration: none; }
.ttc-finder__group { padding: 2rem 1rem; border-left: 1px solid rgba(255,255,255,.11); }
.ttc-finder__group legend { font-size: .78rem; color: #93AAB9; margin-bottom: .8rem; padding: 0; }
.ttc-finder__opts { display: grid; gap: .5rem; }
.ttc-opt {
  -webkit-appearance: none; appearance: none;
  width: 100%; padding: .6rem .75rem; font-family: inherit; font-size: .85rem; font-weight: 700;
  color: var(--navy); background-color: #fff; background-image: none;
  border: 1.5px solid transparent; border-radius: var(--r-sm);
  cursor: pointer; text-align: center; transition: background-color .16s, color .16s, border-color .16s;
}
.ttc-opt:hover { background-color: var(--lightblue); }
/* Selected state must always be visible — it is the control's only affordance. */
.ttc-finder .ttc-opt.is-active,
.ttc-finder .ttc-opt[aria-pressed="true"] {
  background-color: var(--cta) !important; color: #fff !important;
}
.ttc-finder__select {
  width: 100%; padding: .65rem .75rem; font-family: inherit; font-size: .85rem; font-weight: 600;
  color: var(--navy); background: #fff; border: 0; border-radius: var(--r-sm); cursor: pointer;
}
.ttc-finder__submit {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem;
  padding: 2rem 1.25rem; font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.15rem; font-weight: 800;
  line-height: 1.25; color: #fff; background: var(--cta); border: 0; cursor: pointer; text-align: center;
  transition: background-color .18s;
}
.ttc-finder__submit:hover { background: var(--cta-dark); }

@media (max-width: 1180px) {
  .ttc-finder { grid-template-columns: 1fr 1fr 1fr; }
  .ttc-finder__intro { grid-column: 1 / -1; }
  .ttc-finder__group { border-left: 0; border-top: 1px solid rgba(255,255,255,.11); padding: 1.25rem 1.25rem; }
  .ttc-finder__submit { grid-column: 1 / -1; flex-direction: row; padding: 1.25rem; }
}
@media (max-width: 720px) {
  .ttc-finder { grid-template-columns: 1fr; }
  .ttc-finder__intro { padding: 1.75rem 1.35rem; }
}

/* ---------- Delivery methods ---------- */
.ttc-methods { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.25rem; margin-top: 2rem; }
.ttc-method {
  display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 1.4rem; box-shadow: var(--sh-sm);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.ttc-method:hover { transform: translateY(-4px); box-shadow: var(--sh-lg); }
.ttc-method__head { display: grid; grid-template-columns: 1fr 118px; gap: 1rem; align-items: start; }
.ttc-method__icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--lightblue); color: var(--cta); margin-bottom: .7rem; }
.ttc-method__title { font-size: 1.2rem; font-weight: 800; }
.ttc-method__lead { font-size: .9rem; font-weight: 700; color: var(--cta); margin: .3rem 0 0; }
.ttc-method__media img, .ttc-method__media .ttc-imgph { border-radius: var(--r); object-fit: cover; width: 100%; }
.ttc-method__desc { font-size: .92rem; color: var(--muted); margin-top: 1rem; }
.ttc-method__list { display: grid; gap: .5rem; margin-bottom: 1.2rem; }
.ttc-method__list li { display: flex; align-items: flex-start; gap: .5rem; font-size: .9rem; }
.ttc-method__list .ttc-ico { color: var(--teal); }
.ttc-method__cta { margin-top: auto; width: 100%; }

@media (max-width: 980px) { .ttc-methods { grid-template-columns: 1fr; } .ttc-method__head { grid-template-columns: 1fr 150px; } }
@media (max-width: 480px) { .ttc-method__head { grid-template-columns: 1fr; } .ttc-method__media { display: none; } }

/* ---------- Organisations ---------- */
.ttc-org { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem,3vw,3rem); align-items: center; }
.ttc-org__media img, .ttc-org__media .ttc-imgph { border-radius: var(--r-xl); object-fit: cover; width: 100%; box-shadow: var(--sh); }
.ttc-org__copy p { color: var(--muted); max-width: 52ch; }
.ttc-org__ctas { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.4rem; }
.ttc-org__feats {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 1.5rem; margin-top: 2.5rem;
  padding: 1.9rem 1.6rem; background: #fff; border: 1px solid var(--line); border-radius: var(--r-xl);
}
.ttc-org__feats li { text-align: center; }
.ttc-org__feat-ico { display: grid; place-items: center; width: 54px; height: 54px; margin: 0 auto .8rem; border-radius: 50%; background: var(--cta); color: #fff; }
.ttc-org__feats h3 { font-size: 1rem; margin-bottom: .35rem; }
.ttc-org__feats p { font-size: .86rem; color: var(--muted); margin: 0; }

@media (max-width: 900px) { .ttc-org { grid-template-columns: 1fr; } .ttc-org__feats { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 520px) { .ttc-org__feats { grid-template-columns: 1fr; } }

/* ---------- How it works ---------- */
.ttc-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 1rem; margin-top: 2.5rem; position: relative; }
.ttc-step { display: flex; flex-direction: column; align-items: center; position: relative; }
.ttc-step__n {
  display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%;
  background: var(--cta); color: #fff; font-size: .82rem; font-weight: 800; z-index: 2;
}
.ttc-step__ico { display: grid; place-items: center; width: 62px; height: 62px; margin: -8px 0 .9rem; border-radius: 50%; background: var(--lightblue); color: var(--cta); }
.ttc-step:not(:last-child)::after {
  content: ""; position: absolute; top: 19px; left: calc(50% + 30px); right: calc(-50% + 30px);
  border-top: 2px dotted #C3D6E4; z-index: 1;
}
.ttc-step__card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 0 0 1.1rem; overflow: hidden; text-align: center; width: 100%; box-shadow: var(--sh-sm); }
.ttc-step__media img, .ttc-step__media .ttc-imgph { width: 100%; object-fit: cover; }
.ttc-step__title { font-size: 1.02rem; margin: 1rem .85rem .6rem; }
.ttc-step__desc { font-size: .85rem; color: var(--muted); margin: 0 .85rem; }

.ttc-hurry {
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 1.5rem; align-items: center;
  margin-top: 2.5rem; padding: 1.6rem 1.8rem; background: var(--lightblue); border-radius: var(--r-xl);
}
.ttc-hurry__col { display: flex; gap: 1rem; align-items: center; }
.ttc-hurry__col--phone { border-left: 1px solid #C9DEEE; padding-left: 1.5rem; }
.ttc-hurry__ico { display: grid; place-items: center; width: 52px; height: 52px; flex: 0 0 auto; border-radius: 50%; background: var(--cta); color: #fff; }
.ttc-hurry__col--phone .ttc-hurry__ico { background: #fff; color: var(--cta); }
.ttc-hurry h3 { font-size: 1.15rem; margin-bottom: .25rem; }
.ttc-hurry p { font-size: .9rem; color: var(--muted); margin: 0 0 .4rem; }
.ttc-hurry__label { font-size: .88rem; }
.ttc-hurry__num { display: block; font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.55rem; font-weight: 800; color: var(--cta); text-decoration: none; }
.ttc-hurry__note { font-size: .82rem; margin: .2rem 0 0; }

@media (max-width: 1080px) { .ttc-steps { grid-template-columns: repeat(3,1fr); } .ttc-step::after { display: none; } }
@media (max-width: 860px) { .ttc-hurry { grid-template-columns: 1fr; } .ttc-hurry__col--phone { border-left: 0; padding-left: 0; border-top: 1px solid #C9DEEE; padding-top: 1.2rem; } }
@media (max-width: 680px) { .ttc-steps { grid-template-columns: 1fr; gap: 1.25rem; } }

/* ---------- Why ---------- */
.ttc-why { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(1.5rem,3vw,3rem); align-items: center; }
.ttc-why__copy > p { color: var(--muted); max-width: 56ch; }
.ttc-why__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.6rem 1.4rem; margin-top: 1.8rem; }
.ttc-why__grid li { display: grid; gap: .6rem; }
.ttc-why__ico { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--lightblue); color: var(--cta); }
.ttc-why__grid h3 { font-size: .98rem; margin-bottom: .3rem; }
.ttc-why__grid p { font-size: .84rem; color: var(--muted); margin: 0; }
.ttc-why__media img, .ttc-why__media .ttc-imgph { border-radius: var(--r-xl); object-fit: cover; width: 100%; box-shadow: var(--sh); }

@media (max-width: 980px) { .ttc-why { grid-template-columns: 1fr; } .ttc-why__media { order: -1; } }
@media (max-width: 640px) { .ttc-why__grid { grid-template-columns: 1fr; } }

/* ---------- Timeline ---------- */
.ttc-timeline-wrap { background: var(--navy); color: #C5D5E0; }
.ttc-timeline { display: grid; grid-template-columns: .85fr 2.15fr; gap: clamp(1.5rem,3vw,3rem); }
.ttc-timeline__intro p { color: #A9BDCB; font-size: .93rem; }
.ttc-timeline__track { display: grid; grid-template-columns: repeat(5,1fr); gap: 1rem; position: relative; }
.ttc-timeline__node { text-align: center; position: relative; }
.ttc-timeline__dot {
  display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto 1rem;
  border-radius: 50%; background: #D8F1F4; color: var(--navy); font-weight: 800; position: relative; z-index: 2;
}
.ttc-timeline__year { font-family: "Plus Jakarta Sans", sans-serif; font-size: .95rem; }
.ttc-timeline__node:not(:last-child)::after {
  content: ""; position: absolute; top: 29px; left: calc(50% + 34px); right: calc(-50% + 34px);
  border-top: 1px dashed rgba(255,255,255,.3); z-index: 1;
}
.ttc-timeline__node h3 { font-size: .95rem; color: #fff; margin-bottom: .4rem; }
.ttc-timeline__node p { font-size: .82rem; color: #A9BDCB; margin: 0; }

.ttc-stats {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 1.5rem; margin-top: 3rem;
  padding: 1.9rem 1.6rem; background: #fff; border-radius: var(--r-xl);
}
.ttc-stats li { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .35rem; }
.ttc-stats__ico { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--lightblue); color: var(--cta); margin-bottom: .3rem; }
.ttc-stats strong { font-family: "Plus Jakarta Sans", sans-serif; font-size: clamp(1.5rem,1.1rem+1.4vw,2rem); font-weight: 800; color: var(--cta); line-height: 1; }
.ttc-stats span:last-child { font-size: .86rem; color: var(--muted); }

@media (max-width: 1080px) { .ttc-timeline { grid-template-columns: 1fr; } .ttc-timeline__track { grid-template-columns: repeat(3,1fr); } .ttc-timeline__node::after { display: none; } }
@media (max-width: 760px) { .ttc-stats { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 620px) { .ttc-timeline__track { grid-template-columns: 1fr; gap: 1.5rem; } }

/* ---------- Featured courses ---------- */
.ttc-courses { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.25rem; margin-top: 2rem; }
.ttc-course {
  display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line);
  border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-sm);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.ttc-course:hover { transform: translateY(-4px); box-shadow: var(--sh-lg); }
.ttc-course__media { position: relative; }
.ttc-course__media img, .ttc-course__media .ttc-imgph { width: 100%; object-fit: cover; }
.ttc-course__badge {
  position: absolute; top: 12px; left: 12px; padding: .32rem .7rem; border-radius: var(--r-sm);
  font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #fff;
}
.ttc-course__icon { position: absolute; left: 16px; bottom: -20px; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; color: #fff; box-shadow: var(--sh); }
.ttc-course--firstaid .ttc-course__badge, .ttc-course--firstaid .ttc-course__icon { background: var(--c-firstaid); }
.ttc-course--safety .ttc-course__badge, .ttc-course--safety .ttc-course__icon { background: var(--c-safety); }
.ttc-course--food .ttc-course__badge, .ttc-course--food .ttc-course__icon { background: var(--c-food); }
.ttc-course--mind .ttc-course__badge, .ttc-course--mind .ttc-course__icon { background: var(--c-mind); }
.ttc-course__body { display: flex; flex-direction: column; flex: 1; padding: 2rem 1.25rem 1.25rem; }
.ttc-course__title { font-size: 1.13rem; font-weight: 800; margin-bottom: .8rem; }
.ttc-course__meta { display: grid; gap: .45rem; margin-bottom: 1rem; }
.ttc-course__meta li { display: flex; align-items: flex-start; gap: .5rem; font-size: .84rem; color: var(--muted); }
.ttc-course__meta .ttc-ico { color: #8AA0AF; margin-top: .1rem; }
.ttc-course__price { margin: auto 0 1rem; padding-top: .9rem; border-top: 1px solid var(--line); display: flex; align-items: baseline; gap: .4rem; }
.ttc-course__price strong { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.4rem; font-weight: 800; }
.ttc-course--firstaid .ttc-course__price strong { color: var(--c-firstaid); }
.ttc-course--safety .ttc-course__price strong { color: var(--c-safety); }
.ttc-course--food .ttc-course__price strong { color: var(--c-food); }
.ttc-course--mind .ttc-course__price strong { color: var(--c-mind); font-size: 1.1rem; }
.ttc-course__price small { font-size: .8rem; color: var(--muted); }
.ttc-course__cta {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  padding: .8rem 1.1rem; border: 1.5px solid var(--line); border-radius: var(--r);
  font-size: .9rem; font-weight: 700; text-decoration: none; transition: border-color .18s, background-color .18s;
}
.ttc-course--firstaid .ttc-course__cta { color: var(--c-firstaid); }
.ttc-course--safety .ttc-course__cta { color: var(--c-safety); }
.ttc-course--food .ttc-course__cta { color: var(--c-food); }
.ttc-course--mind .ttc-course__cta { color: var(--c-mind); }
.ttc-course__cta:hover { border-color: currentColor; background: #FAFCFE; }

@media (max-width: 1100px) { .ttc-courses { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 600px) { .ttc-courses { grid-template-columns: 1fr; } }

/* ---------- Deals ---------- */
.ttc-deals {
  display: grid; grid-template-columns: 1.05fr .95fr; align-items: stretch;
  background: var(--navy); border-radius: var(--r-xl); overflow: hidden;
}
.ttc-deals__copy { padding: clamp(1.75rem, 3vw, 2.75rem); color: #B9CBD7; }
.ttc-deals__copy p { color: #B9CBD7; max-width: 48ch; }
.ttc-deals__list { display: flex; flex-wrap: wrap; gap: 1rem 1.75rem; margin-top: 1.75rem; padding-top: 1.4rem; border-top: 1px solid rgba(255,255,255,.14); }
.ttc-deals__list li { display: flex; align-items: center; gap: .5rem; font-size: .84rem; font-weight: 600; color: #CFDDE7; }
.ttc-deals__list .ttc-ico { color: var(--teal); }
.ttc-deals__media img, .ttc-deals__media .ttc-imgph { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }

@media (max-width: 900px) { .ttc-deals { grid-template-columns: 1fr; } .ttc-deals__media { order: -1; min-height: 220px; } }

/* ---------- Testimonials ---------- */
.ttc-tst { position: relative; margin-top: 2rem; }
.ttc-tst__track {
  display: grid; grid-auto-flow: column; grid-auto-columns: calc(25% - .95rem); gap: 1.25rem;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
  padding-bottom: .5rem; scrollbar-width: none;
}
.ttc-tst__track::-webkit-scrollbar { display: none; }
.ttc-tst__item { scroll-snap-align: start; }
.ttc-tst__card {
  display: flex; flex-direction: column; height: 100%; margin: 0; padding: 1.5rem 1.35rem;
  background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh-sm);
}
.ttc-tst__mark { font-family: Georgia, serif; font-size: 3rem; line-height: .8; color: var(--cta); opacity: .5; }
.ttc-tst__card blockquote { margin: .6rem 0 1.2rem; padding: 0; border: 0; font-size: .95rem; color: var(--ink); }
.ttc-tst__card figcaption { display: flex; align-items: center; gap: .75rem; margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--line); }
.ttc-tst__avatar { display: grid; place-items: center; width: 42px; height: 42px; flex: 0 0 auto; border-radius: 50%; background: var(--lightblue); color: var(--cta); font-weight: 800; }
.ttc-tst__who { display: grid; }
.ttc-tst__who strong { font-size: .93rem; color: var(--navy); }
.ttc-tst__role { font-size: .82rem; font-weight: 600; color: var(--cta); }
.ttc-tst__sector { font-size: .78rem; color: var(--muted); }
.ttc-tst__stars { display: flex; gap: .1rem; margin-top: .75rem; color: var(--gold); }
.ttc-tst__stars .ttc-ico { fill: currentColor; }
.ttc-tst__nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
  display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%;
  background: #fff; border: 1px solid var(--line); color: var(--navy); cursor: pointer; box-shadow: var(--sh);
}
.ttc-tst__nav:hover { background: var(--lightblue); color: var(--cta); }
.ttc-tst__nav--prev { left: -14px; }
.ttc-tst__nav--next { right: -14px; }

@media (max-width: 1180px) { .ttc-tst__track { grid-auto-columns: calc(50% - .65rem); } .ttc-tst__nav--prev { left: -6px; } .ttc-tst__nav--next { right: -6px; } }
@media (max-width: 700px) { .ttc-tst__track { grid-auto-columns: 86%; } .ttc-tst__nav { display: none; } }

/* ---------- Final CTA ---------- */
.ttc-final {
  display: grid; grid-template-columns: 1.5fr 1fr auto; gap: 1.75rem; align-items: center;
  padding: 1.75rem 2rem; background: var(--navy); border-radius: var(--r-xl); color: #C3D3DE;
}
.ttc-final__copy, .ttc-final__phone { display: flex; gap: 1rem; align-items: center; }
.ttc-final__phone { border-left: 1px solid rgba(255,255,255,.15); padding-left: 1.75rem; }
.ttc-final__ico { display: grid; place-items: center; width: 56px; height: 56px; flex: 0 0 auto; border-radius: 50%; background: rgba(255,255,255,.1); color: #fff; }
.ttc-final h2 { font-size: 1.5rem; color: #fff; margin-bottom: .3rem; }
.ttc-final p { margin: 0; font-size: .92rem; }
.ttc-final__label { font-size: .85rem; }
.ttc-final__num { display: block; font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.6rem; font-weight: 800; color: #fff; text-decoration: none; }
.ttc-final__hours { font-size: .8rem; }
.ttc-final__callback {
  display: flex; align-items: center; gap: .75rem; padding: .95rem 1.25rem;
  background: #fff; border-radius: var(--r); color: var(--cta); text-decoration: none; transition: transform .18s var(--ease);
}
.ttc-final__callback:hover { transform: translateY(-2px); }
.ttc-final__callback span { display: grid; }
.ttc-final__callback strong { font-size: .95rem; }
.ttc-final__callback small { font-size: .76rem; color: var(--muted); }

@media (max-width: 1080px) { .ttc-final { grid-template-columns: 1fr; } .ttc-final__phone { border-left: 0; padding-left: 0; } }

/* ---------- Quality strip ---------- */
.ttc-quality {
  display: grid; grid-template-columns: minmax(240px, .8fr) 2fr; gap: 1.75rem; align-items: center;
  padding: 1.5rem 1.75rem; background: var(--soft); border: 1px solid var(--line); border-radius: var(--r-xl);
}
.ttc-quality__copy { display: flex; gap: 1rem; align-items: center; }
.ttc-quality__ico { display: grid; place-items: center; width: 52px; height: 52px; flex: 0 0 auto; border-radius: 50%; background: var(--lightblue); color: var(--cta); }
.ttc-quality h2 { font-size: 1.1rem; margin-bottom: .25rem; }
.ttc-quality p { font-size: .85rem; color: var(--muted); margin: 0; }
.ttc-quality__logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-around; gap: 1.25rem 1.75rem; }
.ttc-quality__logos li { width: clamp(84px, 10vw, 118px); }
.ttc-quality__logos img { width: 100%; object-fit: contain; filter: grayscale(1); opacity: .75; }
.ttc-quality__logos li:hover img { filter: none; opacity: 1; }

@media (max-width: 900px) { .ttc-quality { grid-template-columns: 1fr; } }

/* ---------- Footer ---------- */
.ttc-footer { background: var(--navy); color: #A9BDCB; padding-top: clamp(2.5rem,4vw,3.5rem); }
.ttc-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1.1fr; gap: 2rem; padding-bottom: 2.5rem; }
.ttc-footer__tag { font-size: .88rem; margin-top: 1rem; max-width: 30ch; }
.ttc-footer__h { font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #fff; margin-bottom: 1rem; }
.ttc-footer__col ul { display: grid; gap: .6rem; }
.ttc-footer__col a { color: #A9BDCB; text-decoration: none; font-size: .89rem; }
.ttc-footer__col a:hover { color: #fff; }
.ttc-footer__contact ul { gap: .8rem; }
.ttc-footer__contact li { display: flex; gap: .6rem; align-items: flex-start; font-size: .89rem; }
.ttc-footer__contact .ttc-ico { color: #6FB6E8; margin-top: .15rem; }
.ttc-footer__addr address { font-style: normal; line-height: 1.6; }
.ttc-footer__bar { border-top: 1px solid rgba(255,255,255,.12); }
.ttc-footer__bar-inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1.5rem; padding-block: 1.2rem; font-size: .82rem; }
.ttc-footer__bar p { margin: 0; }
.ttc-footer__legal { display: flex; flex-wrap: wrap; gap: .5rem; }
.ttc-footer__legal a { color: #A9BDCB; text-decoration: none; }
.ttc-footer__legal a:hover { color: #fff; }

@media (max-width: 1080px) { .ttc-footer__grid { grid-template-columns: repeat(3,1fr); } }
@media (max-width: 720px) { .ttc-footer__grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 480px) { .ttc-footer__grid { grid-template-columns: 1fr; } }

/* ---------- Reveal animation (JS-gated, reduced-motion safe) ---------- */
html.ttc-js .ttc-reveal { opacity: 0; transform: translateY(20px); transition: opacity .65s var(--ease), transform .65s var(--ease); }
html.ttc-js .ttc-reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html.ttc-js .ttc-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  * { scroll-behavior: auto !important; animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* ---------- Trustpilot line ---------- */
.ttc-trustbar__tp { text-align: center; margin: .9rem 0 0; }
.ttc-trustbar__tp a {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .9rem; color: var(--muted); text-decoration: none;
}
.ttc-trustbar__tp a:hover { color: var(--navy); }
.ttc-trustbar__tp strong { color: var(--navy); }
.ttc-trustbar__tpstars { display: inline-flex; gap: .08rem; color: #00B67A; }
.ttc-trustbar__tpstars .ttc-ico { fill: currentColor; }

/* ---------- Client logo marquee ---------- */
.ttc-clients-wrap { background: var(--white); }
.ttc-clients__label { font-size: .88rem; font-weight: 600; color: var(--muted); margin: 0 0 1rem; }
.ttc-clients { position: relative; overflow: hidden; }
.ttc-clients::before, .ttc-clients::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: 70px; z-index: 2; pointer-events: none;
}
.ttc-clients::before { left: 0; background: linear-gradient(90deg, #fff, transparent); }
.ttc-clients::after { right: 0; background: linear-gradient(270deg, #fff, transparent); }
.ttc-clients__track {
  display: flex; align-items: center; gap: clamp(2rem, 5vw, 4rem); width: max-content;
  animation: ttc-marquee 42s linear infinite;
}
.ttc-clients:hover .ttc-clients__track,
.ttc-clients:focus-within .ttc-clients__track { animation-play-state: paused; }
.ttc-clients__track li { flex: 0 0 auto; width: clamp(96px, 11vw, 140px); }
.ttc-clients__logo {
  width: 100%; object-fit: contain; filter: grayscale(1); opacity: .68;
  transition: filter .2s var(--ease), opacity .2s var(--ease);
}
.ttc-clients__track li:hover .ttc-clients__logo { filter: none; opacity: 1; }
@keyframes ttc-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

@media (prefers-reduced-motion: reduce) {
  .ttc-clients__track { animation: none; width: 100%; flex-wrap: wrap; justify-content: center; }
  .ttc-clients::before, .ttc-clients::after { display: none; }
}

/* ---------- Utility bar: account / course finder ---------- */
.ttc-utility__right { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
button.ttc-utility__item {
  background: none; border: 0; padding: 0; font: inherit; color: inherit; cursor: pointer;
}
button.ttc-utility__item:hover, .ttc-utility__right a:hover { color: #fff; }
.ttc-searchtoggle[aria-expanded="true"] { color: #fff; }

/* ---------- Course Finder search panel ---------- */
.ttc-searchpanel {
  background: var(--lightblue); border-bottom: 1px solid #D3E5F5;
  padding-block: 1.1rem; animation: ttc-drop .18s var(--ease);
}
.ttc-searchpanel[hidden] { display: none; }
@keyframes ttc-drop { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.ttc-searchpanel__form {
  display: flex; align-items: center; gap: .6rem;
  background: #fff; border: 1.5px solid #C7DBF3; border-radius: var(--r); padding: .4rem .4rem .4rem .9rem;
}
.ttc-searchpanel__form > .ttc-ico { color: var(--muted); }
.ttc-searchpanel__form input[type="search"] {
  flex: 1; min-width: 0; border: 0; padding: .6rem .2rem; font: inherit; background: transparent;
}
.ttc-searchpanel__form input[type="search"]:focus { outline: none; }
.ttc-searchpanel__close {
  background: none; border: 0; padding: .5rem; color: var(--muted); cursor: pointer; border-radius: var(--r-sm);
}
.ttc-searchpanel__close:hover { background: var(--soft); color: var(--navy); }
.ttc-searchpanel__hint { margin: .7rem 0 0; font-size: .84rem; color: var(--muted); }
.ttc-searchpanel__hint a {
  display: inline-block; margin-left: .5rem; padding: .2rem .6rem; background: #fff;
  border: 1px solid #D3E5F5; border-radius: 999px; text-decoration: none; font-weight: 600;
}
.ttc-searchpanel__hint a:hover { border-color: var(--cta); }
@media (max-width: 620px) {
  .ttc-searchpanel__form { flex-wrap: wrap; }
  .ttc-searchpanel__form input[type="search"] { flex: 1 1 100%; order: -1; }
  .ttc-utility__item--loc { display: none; }
}

/* ---------- Course Finder (two dropdowns) ---------- */
.ttc-searchpanel__title {
  font-family: "Plus Jakarta Sans", Inter, sans-serif; font-weight: 800;
  color: var(--navy); margin: 0 0 .7rem; font-size: 1.05rem;
}
.ttc-cf { display: grid; grid-template-columns: 1fr 1fr auto; gap: .75rem; align-items: end; }
.ttc-cf__field { display: grid; gap: .3rem; min-width: 0; }
.ttc-cf__field label { font-size: .78rem; font-weight: 700; color: var(--muted); }
.ttc-cf select {
  width: 100%; padding: .75rem .9rem; font: inherit; font-weight: 600; color: var(--navy);
  background: #fff; border: 1.5px solid #C7DBF3; border-radius: var(--r); cursor: pointer;
}
.ttc-cf select:focus { outline: none; border-color: var(--cta); box-shadow: 0 0 0 3px rgba(20,104,213,.16); }
.ttc-cf__submit { white-space: nowrap; }
.ttc-cf__status { grid-column: 1 / -1; margin: 0; font-size: .8rem; color: var(--muted); min-height: 1em; }
.ttc-searchpanel__form { margin-top: .9rem; }
@media (max-width: 720px) { .ttc-cf { grid-template-columns: 1fr; } }

/* ---------- Logos: never crop ---------- */
.ttc-trustbar__logo, .ttc-clients__logo, .ttc-quality__logos img { object-fit: contain !important; }
.ttc-trustbar__logos li { display: grid; place-items: center; }
.ttc-clients__track li { display: grid; place-items: center; }

/* ---------- Header menu: never wrap, collapse before it gets cramped ---------- */
.ttc-nav__list { flex-wrap: nowrap; }
.ttc-nav__link { white-space: nowrap; }
.ttc-header__inner { flex-wrap: nowrap; }
.ttc-header__actions { flex: 0 0 auto; }

@media (min-width: 1025px) and (max-width: 1279px) {
  .ttc-nav__link { padding-inline: .45rem; font-size: .85rem; }
  .ttc-header__cta { padding: .7rem 1rem; font-size: .88rem; }
}
/* Collapse to the burger while there is still room, rather than wrapping. */
@media (max-width: 1150px) {
  .ttc-nav { display: none; }
  .ttc-burger { display: inline-flex; }
  .ttc-mobilenav:not([hidden]) { display: block; }
}