@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Hind:wght@300;400;500;600;700&family=Manrope:wght@300;400;500;600;700&display=swap');


  /* ---------- Root / wrapper ---------- */
  .tth {
    --navy:    #003057;
    --plum:    #A20067;
    --blue:    #005EB8;
    --forest:  #005059;
    --sunshine:#FFB81C;
    --stone:   #F7F4F0;
    --ink:     #0E1B2A;
    --line:    rgba(0,48,87,.14);

    font-family: "Hind","Helvetica Neue",Arial,sans-serif;
    font-weight: 400;
    font-size: 17px;
    line-height: 1.55;
    color: var(--ink);
    background: #fff;
    -webkit-font-smoothing: antialiased;
    scroll-behavior: smooth;
  }

  .tth * { box-sizing: border-box; }
  .tth img { max-width: 100%; display: block; }
  .tth a { color: inherit; }

.tth #why {padding-top: 68px;padding-bottom:40px;}
.tth #courses {padding-top:20px;padding-bottom:60px;}
.tth #getstarted {padding-top:60px;padding-bottom:60px;}
  /* ---------- Type helpers ---------- */
  .tth .nohemi { font-family:"Helvetica Neue",Arial,sans-serif; letter-spacing:-0.01em; }
  .tth .serif  { font-family:"DM Serif Display",Georgia,serif; font-style:italic; }

  .tth h1, .tth h2, .tth h3, .tth h4 {
    font-family: "Helvetica Neue",Arial,sans-serif;
    font-weight: 600;
    letter-spacing: -0.015em;
    margin: 0;
    color: var(--navy);
  }
 .tth h1 { font-size: clamp(34px, 4.6vw, 44px); line-height: 1.02; font-weight: 600; }
.tth h2 { font-size: clamp(26px, 2.8vw, 38px); line-height: 1.05; }
.tth h3 { font-size: clamp(18px, 1.5vw, 22px); line-height: 1.15; font-weight: 500; }
  .tth h4 { font-size: 18px; line-height: 1.2; font-weight: 600; }
  .tth p  { margin: 0;margin-bottom:12px; }

  .tth .eyebrow {
    font-weight: 500;
    font-size: 13px !important;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--plum);
  }
  .tth .eyebrow .dot {
    display: inline-block;
    width: 6px; height: 6px;
    background: var(--sunshine);
    margin-right: 10px;
    transform: translateY(-2px);
  }

  .tth .container      { max-width: 1280px; margin: 0 auto; padding: 0 32px; }
  .tth .container--wide{ max-width: 1360px; }

#faq {background-color:var(--stone);padding-top:40px;padding-bottom:40px;}

  /* ---------- Buttons ---------- */
  .tth .btn {
    display: inline-flex; align-items: center; gap: 10px;
    font-weight: 500;
    letter-spacing: .01em;
    padding: 14px 22px 10px 22px;
    border-radius: 10px;
    border: 1px solid transparent;
    text-decoration: none;
    cursor: pointer;
    transition: transform .15s ease, background .2s ease, color .2s ease, border-color .2s ease;
  }
  .tth .btn:hover         { transform: translateY(-1px); }
  .tth .btn--plum         { background: var(--plum); color: #fff !important; }
  .tth .btn--plum:hover   { background: #8a0058; }
  .tth .btn--sunshine     { background: var(--sunshine); color: var(--navy) !important; }
  .tth .btn--sunshine:hover{ background: #ffc445; }
  .tth .btn--ghost        { background: transparent; color: #fff; border-color: rgba(255,255,255,.45); }
  .tth .btn--ghost:hover  { border-color: #fff; background: rgba(255,255,255,.06); }
  .tth .btn--ink          { background: var(--navy); color: #fff; }
  .tth .btn--ink:hover    { background: #001f3a; }
  .tth .btn--outline      { background: transparent; color: var(--navy); border-color: var(--navy); }
  .tth .btn--outline:hover{ background: var(--navy); color: #fff !important; }
  .tth .btn .arr          { display: inline-block; transition: transform .2s ease; }
  .tth .btn:hover .arr    { transform: translateX(3px); }

  /* ---------- Nav ---------- */
  .tth .nav {
    position: sticky; top: 0; z-index: 50;
    background: rgba(0,48,87,.92);
    backdrop-filter: blur(8px);
    color: #fff;
  }
  .tth .nav__inner {
    display: flex; align-items: center; justify-content: space-between;
    height: 72px;
  }
  .tth .logo {
    display: flex; align-items: baseline; gap: 10px;
    font-weight: 600; letter-spacing: -0.01em;
    color: #fff; text-decoration: none;
  }
  .tth .logo__dots        { display: inline-flex; gap: 4px; transform: translateY(2px); }
  .tth .logo__dots i      { width: 6px; height: 6px; border-radius: 50%; background: var(--sunshine); display: block; }
  .tth .logo__dots i:nth-child(1){ opacity: .45; }
  .tth .logo__dots i:nth-child(2){ opacity: .75; }
  .tth .logo__dots i:nth-child(3){ opacity: 1; }
  .tth .logo__name        { font-size: 18px; }
  .tth .logo__name b      { font-weight: 600; }
  .tth .logo__sub {
    font-size: 11px; opacity: .7; letter-spacing: .12em; text-transform: uppercase;
    padding-left: 12px; border-left: 1px solid rgba(255,255,255,.2);
  }
  .tth .nav__links        { display: flex; gap: 32px; align-items: center; }
  .tth .nav__links a {
    color: #fff; text-decoration: none; font-size: 15px;
     font-weight: 400;
    opacity: .85;
  }
  .tth .nav__links a:hover{ opacity: 1; }
  .tth .nav__cta          { display: flex; gap: 12px; align-items: center; }
  .tth .nav__login {
    color: #fff; text-decoration: none; font-size: 15px; opacity: .85;
  
  }

  /* ---------- Hero ---------- */
  .tth .hero {
    position: relative;
    background: var(--stone);
    color: #fff;
    overflow: hidden;
    min-height: 640px;
    padding: 0 32px;
  }
  .tth .hero__inner {
    padding: 72px 0px 72px;
    position: relative;
    z-index: 2;
  }
  .tth .hero__content    {max-width: 580px;padding-bottom: 18px;}
  .tth .hero h1          { color: var(--plum);}
  .tth .hero h1 .accent  { color: var(--navy); }
  .tth .hero h1 .ital {
    font-family: "DM Serif Display",serif; font-style: italic;
    font-weight: 400;
    font-size: 1.13em;
    line-height: .95;
    color: var(--navy);
  }
  .tth .hero__lede {
    margin-top: 28px;
    max-width: 500px;
    color: var(--navy);
    font-size: 19px;
    line-height: 1.55;
  }
  .tth .hero__lede strong{ color: var(--navy); font-weight: 500; }
  .tth .hero__ctas        { margin-top: 36px; display: flex; gap: 14px; flex-wrap: wrap; }
  .tth .hero__meta {
    margin-top: 44px;
    display: flex; gap: 36px; flex-wrap: wrap;
    border-top: 1px solid rgba(255,255,255,.14);
    padding-top: 28px;
  }
  .tth .hero__meta b {
    font-weight: 600;
    font-size: 28px; color: #fff; display: block; line-height: 1;
  }
  .tth .hero__meta span {
    font-size: 13px; color: rgba(255,255,255,.65);
    letter-spacing: .04em; margin-top: 6px; display: block;
  }

  /* Full-height angled photo panel — sits outside .container, absolutely positioned */
  .tth .hero__img-panel {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 55%;
    /* diagonal left edge: top of panel starts further right, sweeps left toward bottom */
    clip-path: polygon(35% 0, 100% 0, 100% 100%, 0% 100%);
    overflow: hidden;
    z-index: 1;
    margin-bottom: 1px;
  }
  /* Placeholder — swap src on <img> or replace .ph with a real <img> tag */
  .tth .hero__img-panel .ph {
    width: 100%; height: 100%;
    background:
      linear-gradient(200deg, rgba(0,48,87,.18) 0%, rgba(0,80,89,.45) 55%, rgba(162,0,103,.12) 100%),
      repeating-linear-gradient(45deg, #b9a98f 0 18px, #cfc0a4 18px 36px);
  }
  /* When a real <img> is used inside .hero__img-panel */
  .tth .hero__img-panel img {
    width: 100%; height: 100%; object-fit: cover; display: block;
  }

  .tth .hero__slice {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 60px;
    background: #fff;
    clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 100%);
    z-index: 3;
  }

  .tth .tth-logo {max-width: 300px;height: auto;padding-bottom:18px;}

  /* ---------- Trust strip ---------- */
  .tth .trust {
    background: #fff;
    padding: 28px 0 8px;
    border-bottom: 1px solid var(--line);
  }
  .tth .trust__inner {
    display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap;
  }
  .tth .trust__label {
     font-weight: 500; font-size: 13px; letter-spacing: .16em; text-transform: uppercase;
    color: var(--navy); opacity: .6;
  }
  .tth .trust__logos        { display: flex; gap: 48px; flex-wrap: wrap; align-items: center; }
  .tth .trust__logos span   {  font-weight: 500; font-size: 18px; color: var(--navy); opacity: .55; letter-spacing: -.01em; }



  /* ---------- Why ---------- */
  .tth .why__head         { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; margin-bottom: 64px; }
  .tth .why__title .ital  { font-family: "DM Serif Display"; font-style: italic; font-weight: 400; font-size: 1.14em; line-height: .95; color: var(--plum); }
  .tth .why__intro        { color: rgba(14,27,42,.72); font-size: 18px; line-height: 1.55; max-width: 520px; justify-self: end; }
  .tth .why__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    margin-bottom: 32px;
  }
  .tth .why__cell {
    padding: 40px 28px 44px;
    border-right: 1px solid var(--line);
    display: flex; flex-direction: column; gap: 14px;
    position: relative;
    background: #fff;
    transition: background .2s ease;
  }
  .tth .why__cell:last-child { border-right: none; }
  .tth .why__cell:hover      { background: var(--stone); }
  .tth .why__num             {  font-weight: 500; font-size: 13px; color: var(--plum); letter-spacing: .12em; }
  .tth .why__cell h3         { color: var(--navy); }
  .tth .why__cell h3 b       { color: var(--plum); font-weight: 600; }
  .tth .why__cell p          { color: rgba(14,27,42,.7); font-size: 15.5px; line-height: 1.55; margin-top: 4px; }
  .tth .why__icon            { width: 44px; height: 44px; margin-bottom: 4px; color: var(--navy); }

  /* ---------- Realities ---------- */
 .tth .realities {
  background: var(--forest);
  color: #fff;
  position: relative;
  overflow: visible;
  padding: 128px 0;
  /* no margin */
}

.tth .realities::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -1px; /* -2px instead of -1px */
  height: 60px;
  background: #fff;
  clip-path: polygon(0 0, 100% 0, 100% 0, 0 100%);
}

.tth .realities::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px; /* -2px instead of -1px */
  height: 60px;
  background: #fff;
  clip-path: polygon(0 0, 100% 100%, 100% 100%, 0 100%);
}
  .tth .realities h2             { color: #fff; max-width: 880px; }
  .tth .realities h2 .ital       { font-family: "DM Serif Display"; font-style: italic; font-weight: 400; color: var(--sunshine); font-size: 1.14em; }
  .tth .realities__grid          { margin-top: 56px; display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
  .tth .realities__copy p        { color: rgba(255,255,255,.78); font-size: 18px; line-height: 1.6; max-width: 520px; }
  .tth .realities__copy p + p    { margin-top: 18px; }
  .tth .realities__pills         { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
  .tth .realities__pills span    { font-weight: 400; font-size: 14px; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.25); color: rgba(255,255,255,.9); }


  /* ---------- Courses ---------- */
  .tth .courses__head    { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: end; margin-bottom: 40px; }
  .tth .courses__head h2 .ital { font-family: "DM Serif Display"; font-style: italic; font-weight: 400; font-size: 1.14em; color: var(--plum); }
  .tth .courses__head p  { color: rgba(14,27,42,.7); margin-top: 18px; max-width: 560px; font-size: 18px; }

  /* Search bar */
  .tth .search {
    display: flex; align-items: center; gap: 12px;
    background: var(--stone);
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 8px 8px 8px 22px;
    margin-bottom: 28px;
    max-width: 760px;
  }
  .tth .search svg    { color: rgba(0,48,87,.55); flex-shrink: 0; }
  .tth .search input  {
    flex: 1; border: 0; background: transparent; outline: none;
    font-family: "Hind",sans-serif; font-size: 15px; color: var(--navy);
    padding: 10px 0;
  }
  .tth .search input::placeholder { color: rgba(0,48,87,.45); }
  .tth .search button {
    border: 0; background: var(--navy); color: #fff;
     font-size: 14px; font-weight: 500;
    padding: 10px 20px; border-radius: 999px; cursor: pointer;
  }

  /* Filter chips */
  .tth .filters { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 36px; }
  .tth .chip {
     font-weight: 400; font-size: 14px;
    padding: 8px 16px; border-radius: 999px;
    background: #fff; border: 1px solid var(--line);
    color: var(--navy);
    cursor: pointer;
    transition: background .15s, border-color .15s, color .15s;
  }
  .tth .chip:hover        { border-color: var(--navy); }
  .tth .chip--active      { background: var(--navy); color: #fff !important; border-color: var(--navy); }

  /* Course grid */
  .tth .courses__grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px;
  }
  .tth .course {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    overflow: hidden;
    display: flex; flex-direction: column;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s;
  }
  .tth .course:hover { transform: translateY(-3px); box-shadow: 0 20px 40px rgba(0,48,87,.08); border-color: rgba(0,48,87,.25); }
  .tth .course__cover { aspect-ratio: 12/6; position: relative; overflow: hidden; }
  .tth .course__cover .ph { width: 100%; height: 100%; }

  /* Cover colour patterns */
  .tth .cover-1  .ph { background: var(--plum)   repeating-linear-gradient(45deg,  rgba(255,255,255,.06) 0 18px, transparent 18px 36px); }
  .tth .cover-2  .ph { background: var(--navy)   repeating-linear-gradient(135deg, rgba(255,184,28,.18)  0 14px, transparent 14px 28px); }
  .tth .cover-3  .ph { background: var(--forest) repeating-linear-gradient(0deg,   rgba(255,255,255,.06) 0 22px, transparent 22px 44px); }
  .tth .cover-4  .ph { background: var(--blue)   repeating-linear-gradient(90deg,  rgba(255,255,255,.08) 0 20px, transparent 20px 40px); }
  .tth .cover-5  .ph { background: var(--plum); }
  .tth .cover-6  .ph { background: var(--navy); }
  .tth .cover-7  .ph { background: var(--forest); }
  .tth .cover-8  .ph { background: var(--blue)   repeating-linear-gradient(45deg,  rgba(255,255,255,.08) 0 16px, transparent 16px 32px); }
  .tth .cover-9  .ph { background: var(--plum)   repeating-linear-gradient(135deg, rgba(255,255,255,.07) 0 22px, transparent 22px 44px); }
  .tth .cover-10 .ph { background: var(--navy)   repeating-linear-gradient(0deg,   rgba(255,255,255,.07) 0 24px, transparent 24px 48px); }
  .tth .cover-11 .ph { background: var(--forest) repeating-linear-gradient(45deg,  rgba(255,184,28,.18)  0 14px, transparent 14px 28px); }
  .tth .cover-12 .ph { background: var(--blue); }

  .tth .course__cover .lbl { position: absolute; left: 14px; bottom: 14px; background: rgba(255,255,255,.95); color: var(--navy); font-family: "JetBrains Mono",ui-monospace,monospace; font-size: 10.5px; padding: 4px 8px; border-radius: 4px; letter-spacing: .04em; }
  .tth .course__tag   { position: absolute; left: 14px; top: 14px;  font-weight: 500; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; background: var(--sunshine); color: var(--navy); padding: 5px 10px; border-radius: 4px; }
  .tth .course__body  { padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
  .tth .course__cat   {font-weight: 500; font-size: 12px; text-transform: uppercase; color: var(--plum); }
  .tth .course__title { font-weight: 600; font-size: 21px; line-height: 1.2; color: var(--navy); }
  .tth .course__desc  { color: rgba(14,27,42,.7); line-height: 1.55; flex: 1; }
  .tth .course__meta  { display: grid; grid-template-columns: auto auto auto; gap: 14px; padding-top: 16px; border-top: 1px solid var(--line); align-items: center; }
  .tth .course__meta div { font-size: 12.5px; color: rgba(14,27,42,.65); display: flex; align-items: center; gap: 6px; }
  .tth .course__meta div b { font-weight: 600; color: var(--navy); font-size: 13px; }
  .tth .course__price { justify-self: end; }
  .tth .course__price b { color: var(--plum) !important; font-size: 18px !important; }
  .tth .courses__more { margin-top: 44px; display: flex; justify-content: center; }

  /* ---------- Testimonials ---------- */
  .tth .testimonials { background: var(--stone); position: relative; }
  .tth .testimonials__head { display: grid; grid-template-columns: 1.2fr 1fr; gap: 64px; align-items: end; margin-bottom: 56px; }
  .tth .testimonials__head h2 .ital { font-family: "DM Serif Display"; font-style: italic; color: var(--plum); font-size: 1.14em; font-weight: 400; }
  .tth .testimonials__head .meta    { color: rgba(14,27,42,.7); font-size: 17px; max-width: 420px; }
  .tth .quotes { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 24px; align-items: stretch; }
  .tth .quote {
    background: #fff;
    border-radius: 18px;
    padding: 36px 32px;
    display: flex; flex-direction: column; gap: 22px;
    border: 1px solid var(--line);
  }
  .tth .quote--feature              { background: var(--navy); color: #fff; border: none; }
  .tth .quote--feature .quote__text { color: #fff; }
  .tth .quote--feature .quote__author b    { color: #fff; }
  .tth .quote--feature .quote__author span { color: rgba(255,255,255,.7); }
  .tth .quote__mark   { font-family: "DM Serif Display"; font-size: 64px; line-height: .6; color: var(--plum); height: 32px; }
  .tth .quote--feature .quote__mark { color: var(--sunshine); }
  .tth .quote__text   { font-weight: 400; font-size: 20px; line-height: 1.4; color: var(--navy); flex: 1; }
  .tth .quote--feature .quote__text { font-size: 26px; }
  .tth .quote__author { display: flex; align-items: center; gap: 14px; padding-top: 22px; border-top: 1px solid var(--line); }
  .tth .quote--feature .quote__author { border-color: rgba(255,255,255,.18); }
  .tth .quote__avatar { width: 44px; height: 44px; border-radius: 50%; background: repeating-linear-gradient(45deg, #c9c2b6 0 8px, #d6d0c5 8px 16px); flex-shrink: 0; border: 2px solid #fff; }
  .tth .quote--feature .quote__avatar { border-color: var(--navy); }
  .tth .quote__author b    { font-weight: 600; font-size: 15px; color: var(--navy); display: block; }
  .tth .quote__author span { font-size: 13px; color: rgba(14,27,42,.6); }

  /* ---------- FAQ ---------- */
  .tth .faq__inner     { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 80px; align-items: start; }
  .tth .faq__inner h2 .ital { font-family: "DM Serif Display"; font-style: italic; color: var(--plum); font-size: 1.14em; font-weight: 400; }
  .tth .faq__inner > div:first-child p { color: rgba(14,27,42,.72); margin-top: 18px; max-width: 360px; font-size: 17px; }
  .tth details.faq     { border-bottom: 1px solid var(--line); padding: 22px 4px; }
  .tth details.faq summary {
    list-style: none; cursor: pointer;
    display: flex; align-items: center; justify-content: space-between; gap: 24px;
    font-weight: 500; font-size: 19px; color: var(--navy);
  }
  .tth details.faq summary::-webkit-details-marker { display: none; }
  .tth details.faq .icn {
    width: 32px; height: 32px; flex-shrink: 0;
    border: 1px solid var(--line); border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: var(--navy);
    transition: transform .2s ease, background .2s, color .2s, border-color .2s;
  }
  .tth details.faq[open] .icn { transform: rotate(45deg); background: var(--plum); color: #fff; border-color: var(--plum); }
  .tth details.faq p   { color: rgba(14,27,42,.72); margin-top: 14px; max-width: 620px; font-size: 16px; line-height: 1.6; }

  /* ---------- Get started ---------- */
  .tth .getstarted {
    background: var(--navy);
    color: #fff;
    position: relative;
    overflow: hidden;
  }

  .tth .getstarted__inner  { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; position: relative; }
  .tth .getstarted h2       { color: #fff; }
  .tth .getstarted h2 .ital { font-family: "DM Serif Display"; font-style: italic; color: var(--sunshine); font-size: 1.14em; font-weight: 400; }
  .tth .getstarted__lede    { color: rgba(255,255,255,.78); font-size: 18px; line-height: 1.6; margin-top: 22px; max-width: 480px; }
  .tth .getstarted__steps   { margin-top: 36px; display: flex; flex-direction: column; gap: 18px; }
  .tth .step                { display: flex; gap: 18px; align-items: flex-start; }
  .tth .step__num           { flex-shrink: 0; width: 36px; height: 36px; border-radius: 50%; background: var(--sunshine); color: var(--navy) !important; font-weight: 600; font-size: 15px; display: flex; align-items: center; justify-content: center;padding-top: 3px; }
  .tth .step b              { font-weight: 500; color: #fff; display: block; margin-bottom: 4px; }
  .tth .step span           { color: rgba(255,255,255,.65);line-height: 1.5; }

  /* Lead form */
  .tth .form          { background: #fff; color: var(--navy); border-radius: 22px; padding: 36px; box-shadow: 0 30px 70px rgba(0,0,0,.3); }
  .tth .form h3       { color: var(--navy); }
  .tth .form__sub     { color: rgba(14,27,42,.65); margin-top: 8px; }
  .tth .form__row     { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 20px; }
  .tth .form__group   { display: flex; flex-direction: column; gap: 6px; }
  .tth .form__group--full { grid-column: span 2; }
  .tth .form label    {  font-weight: 500; font-size: 13px; color: var(--navy); letter-spacing: .02em; }
  .tth .form input, .tth .form select, .tth .form textarea {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 12px 14px;
    font-family: "Hind",sans-serif; font-size: 15px;
    color: var(--navy); background: #fff;
    transition: border-color .15s, box-shadow .15s;
    width: 100%;
  }
  .tth .form input:focus, .tth .form select:focus, .tth .form textarea:focus {
    outline: none; border-color: var(--plum); box-shadow: 0 0 0 3px rgba(162,0,103,.12);
  }
  .tth .form .checkbox { display: flex; align-items: flex-start; gap: 10px; margin-top: 16px; font-size: 13px; color: rgba(14,27,42,.65); }
  .tth .form .checkbox input { margin-top: 2px; width: auto; }
  .tth .form button    { margin-top: 22px; width: 100%; justify-content: center; }

  /* ---------- Footer ---------- */
  .tth footer {
    background: #001f3a;
    color: rgba(255,255,255,.72);
    padding: 80px 0 40px;
    font-size: 14.5px;
  }
  .tth .foot__top {
    display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 48px;
    padding-bottom: 56px; border-bottom: 1px solid rgba(255,255,255,.1);
  }
  .tth .foot__top h5  { font-weight: 500; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: #fff; margin: 0 0 18px; }
  .tth .foot__links   { display: flex; flex-direction: column; gap: 10px; }
  .tth .foot__links a { color: rgba(255,255,255,.7); text-decoration: none; }
  .tth .foot__links a:hover { color: #fff; }
  .tth .foot__bottom  { padding-top: 32px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
  .tth .foot__legal   { font-size: 13px; color: rgba(255,255,255,.5); }
  .tth .foot__legal a { color: rgba(255,255,255,.7); margin-left: 18px; text-decoration: none; }
  .tth .foot__brand   { display: flex; flex-direction: column; gap: 14px; }
  .tth .foot__brand p { max-width: 320px; }
  .tth .foot__contact { font-size: 14px; color: rgba(255,255,255,.7); margin-top: 10px; }
  .tth .foot__contact div { margin-bottom: 4px; }

  /* ---------- Responsive ---------- */
  @media (max-width: 1100px) {
    .tth .hero__inner                           { padding: 80px 0 120px; }
    .tth .hero__img-panel                       { width: 46%; clip-path: polygon(16% 0, 100% 0, 100% 100%, 0% 100%); }
    .tth .why__grid                             { grid-template-columns: 1fr 1fr; }
    .tth .why__cell:nth-child(2)                { border-right: none; }
    .tth .why__cell:nth-child(1),
    .tth .why__cell:nth-child(2)                { border-bottom: 1px solid var(--line); }
    .tth .courses__grid                         { grid-template-columns: 1fr 1fr; }
    .tth .quotes                                { grid-template-columns: 1fr 1fr; }
    .tth .quote--feature                        { grid-column: span 2; }
    .tth .realities__grid,
    .tth .getstarted__inner,
    .tth .faq__inner,
    .tth .why__head,
    .tth .testimonials__head,
    .tth .courses__head                         { grid-template-columns: 1fr; gap: 36px; }
    .tth .foot__top                             { grid-template-columns: 1fr 1fr; }
  }

  @media (max-width: 700px) {
    .tth section                                { padding: 80px 0; }
    .tth .container                             { padding: 0 22px; }
    .tth .nav__links                            { display: none; }
    .tth .hero__inner                           { padding: 60px 0 100px; }
    .tth .hero__img-panel                       { display: none; }
    .tth .why__grid                             { grid-template-columns: 1fr; }
    .tth .why__cell                             { border-right: none !important; border-bottom: 1px solid var(--line); }
    .tth .why__cell:last-child                  { border-bottom: none; }
    .tth .courses__grid                         { grid-template-columns: 1fr; }
    .tth .quotes                                { grid-template-columns: 1fr; }
    .tth .quote--feature                        { grid-column: auto; }
    .tth .form__row                             { grid-template-columns: 1fr; }
    .tth .form__group--full                     { grid-column: auto; }
    .tth .foot__top                             { grid-template-columns: 1fr; }
  }


  .tth .realities__carousel {
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-self: center;
}

.tth .realities__carousel-frame {
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 32px 80px rgba(0,0,0,.35);
  background: #fff;
}

.tth .realities__carousel-chrome {
  background: #f0ede9;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}

.tth .realities__chrome-dots {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}

.tth .realities__chrome-dots i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #d9d4ce;
  display: block;
}

.tth .realities__chrome-dots i:first-child {
  background: var(--sunshine);
}

.tth .realities__chrome-url {
  flex: 1;
  background: #fff;
  border-radius: 6px;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px;
  color: rgba(0,48,87,.55);
  padding: 5px 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tth .realities__slides {
  position: relative;
  aspect-ratio: 16 / 10;
  background: var(--stone);
}

.tth .realities__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.7s ease;
  pointer-events: none;
}

.tth .realities__slide--active {
  opacity: 1;
  pointer-events: auto;
}

.tth .realities__slide img,
.tth .realities__slide .ph--screen {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.tth .ph--1 { background: linear-gradient(135deg, var(--navy) 0%, var(--forest) 100%); }
.tth .ph--2 { background: linear-gradient(135deg, var(--plum) 0%, var(--navy) 100%); }
.tth .ph--3 { background: linear-gradient(135deg, var(--forest) 0%, var(--blue) 100%); }

.tth .realities__carousel-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
}

.tth .realities__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,.3);
  cursor: pointer;
  padding: 0;
  transition: background .25s ease, transform .25s ease;
}

.tth .realities__dot--active {
  background: var(--sunshine);
  transform: scale(1.35);
}

.tth .realities__dot:hover {
  background: rgba(255,255,255,.6);
}


.twoOptionFormFieldBlock div.radiobuttons > div, .twoOptionFormFieldBlock div.twooption_checkbox > div, .optionSetFormFieldBlock div.radiobuttons > div, .multiOptionSetFormFieldBlock fieldset > div, .consentBlock > div
 {
    display: block !important;
    font-weight: normal !important;
}

.textFormFieldBlock label, .dateTimeFormFieldBlock label, .lookupFormFieldBlock label, .twoOptionFormFieldBlock label.block-label, .optionSetFormFieldBlock label.block-label, .multiOptionSetFormFieldBlock label.block-label, div[data-editorblocktype="Captcha"] label[id^="wlspispHipInstructionContainer"], .textFormFieldBlock label *, .dateTimeFormFieldBlock label *, .lookupFormFieldBlock label *, .twoOptionFormFieldBlock label.block-label *, .optionSetFormFieldBlock label.block-label *, .multiOptionSetFormFieldBlock label.block-label *, .consentBlock label p {
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 16px;
    font-weight: normal !important;
    color: rgb(50, 49, 48);
}

.textFormFieldBlock, .dateTimeFormFieldBlock, .twoOptionFormFieldBlock, .optionSetFormFieldBlock, .multiOptionSetFormFieldBlock, .lookupFormFieldBlock {
    padding: 10px 0px !important;
}

.textFormFieldBlock label, .dateTimeFormFieldBlock label, .lookupFormFieldBlock label, .twoOptionFormFieldBlock label.block-label, .optionSetFormFieldBlock label.block-label, .multiOptionSetFormFieldBlock label.block-label, div[data-editorblocktype="Captcha"] label[id^="wlspispHipInstructionContainer"], .textFormFieldBlock label *, .dateTimeFormFieldBlock label *, .lookupFormFieldBlock label *, .twoOptionFormFieldBlock label.block-label *, .optionSetFormFieldBlock label.block-label *, .multiOptionSetFormFieldBlock label.block-label *, .consentBlock label p {
    font-family: "Hind" !important;
    font-size: 16px !important;
}

.marketingForm th.columnContainer, .marketingForm th.inner {
    font-weight: normal !important;
    padding-left: 0px !important;
    padding-right: 4px !important;
}

     .tth .courses__empty {
        padding: 60px 0; text-align: center;
        color: rgba(14,27,42,.6); font-size: 17px;
      }
      .tth .courses__empty a { color: var(--plum); text-decoration: underline; }
      .tth .courses__cta-link {
        display: inline-flex; align-items: center; gap: 6px;
       font-weight: 500;
        font-size: 14px; color: var(--plum); text-decoration: none; margin-top: 12px;
      }
      .tth .courses__paging {
        display: flex; justify-content: center; align-items: center;
        gap: 8px; margin-top: 44px; flex-wrap: wrap;
      }
      .tth .courses__page-btn {
         font-size: 14px; font-weight: 500;
        padding: 9px 16px; border-radius: 999px; border: 1px solid var(--line);
        color: var(--navy); text-decoration: none; background: #fff;
        transition: background .15s, border-color .15s, color .15s;
      }
      .tth .courses__page-btn:hover { border-color: var(--navy); }
      .tth .courses__page-btn--active { background: var(--navy); color: #fff !important; border-color: var(--navy); }
      .tth .courses__page-btn--prev,
      .tth .courses__page-btn--next { padding: 9px 20px; }
      .tth .course__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }


      .faq__trigger {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  background: none;
  border: 0;
  padding: 16px 0;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.faq__panel { display: none; padding: 0 0 16px; }
.faq.is-open .faq__panel { display: block; }
.faq.is-open .icn { transform: rotate(45deg); }
.icn { transition: transform .2s ease; display: inline-block; }


/* ---------- FAQ ---------- */

.tth .faq {
  border-bottom: 1px solid var(--line);
}

.tth .faq__trigger {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  background: none;
  border: 0;
  padding: 22px 0;
  text-align: left;
  font-family: "Hind", "Helvetica Neue", Arial, sans-serif;
  font-weight: 500;
  font-size: 19px;
  color: var(--navy);
  cursor: pointer;
}

.tth .faq__q {
  flex: 1;
}

.tth .icn {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border: 1px solid var(--line);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--navy);
  font-size: 20px;
  line-height: 1;
  transition: transform .2s ease, background .2s, color .2s, border-color .2s;
  padding-top: 3px;
}

.tth .faq.is-open .icn {
  transform: rotate(45deg);
  background: var(--plum);
  color: #fff;
  border-color: var(--plum);
}

.tth .faq__panel {
  display: none;
  padding: 4px 0 22px;
}

.tth .faq.is-open .faq__panel {
  display: block;
}

.tth .faq__panel p {
  color: rgba(14, 27, 42, .72);
  margin-top: 0;
  max-width: 620px;
  font-size: 16px;
  line-height: 1.6;
}


  .access{
    padding: 80px 0;

  }
  .access__inner{
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 48px;
    align-items: center;
  }
  .access__copy h2 .ital{ font-family:"DM Serif Display"; font-style:italic; color: var(--plum); font-size:1.14em; font-weight:400; }
  .access__actions{ display:flex; gap: 12px; flex-wrap: wrap; align-items:center; }

  footer{
    background: #001f3a;
    color: rgba(255,255,255,.72);
    padding: 80px 0 40px;
    font-size: 14.5px;
  }

  footer img.tth-logo {filter: brightness(0) invert(1);height:auto;max-width: 250px;}

  .foot__top{
    display:grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 48px;
    padding-bottom: 56px; border-bottom: 1px solid rgba(255,255,255,.1);
  }
  .foot__top h5{
    font-family:"Hind"; font-weight:500; font-size:13px; letter-spacing:.16em; text-transform:uppercase;
    color:#fff; margin: 0 0 18px;
  }
  .foot__links{ display:flex; flex-direction:column; gap: 10px; }
  .foot__links a{ color: #fff !important; text-decoration:underline; }
  .foot__links a:hover{ color:#fff; }
  .foot__bottom{
    padding-top: 32px;
    display:flex; justify-content:space-between; align-items:center; gap: 24px; flex-wrap:wrap;
  }
  .foot__legal{ font-size: 13px; color: rgba(255,255,255,.5); }
  .foot__legal a{ color: rgba(255,255,255,.7); margin-left: 18px; text-decoration:none; }
  .foot__brand{
    display:flex; flex-direction:column; gap:14px;
  }
  .foot__brand p{ max-width: 320px; }
  .foot__contact{ font-size: 14px; color: rgba(255,255,255,.7); margin-top: 10px; }
  .foot__contact div{ margin-bottom: 4px; }