@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,300..700&family=Source+Sans+3:ital,wght@0,300..700;1,400&display=swap');


:root {
  --TT-teal: #1f998f; 
  --hover-color: #198077;
  --header-color: #0d3b37;
  --nav-link: #fff;
  --nav-link-hover: #c0c0c0;
  --nav-link2: #0027a6;
  --light-gray-field: #e6e6e6;
  --font-heading: "DM Sans", sans-serif;
  --font-text: "Source Sans 3", sans-serif;
}


* { box-sizing: border-box; }
body { font-family: var(--font-text); min-height: 100vh; display: flex; flex-direction: column; margin: 0; position: relative; }
#footer { padding-top: 40px; margin-top: auto; }

p  { font-size: 16px; line-height: normal; letter-spacing: normal; margin: 0; padding: 0; }
h1 { font-size: 32px; line-height: normal; letter-spacing: normal; margin: 0; padding: 0; font-family: var(--font-heading); }
h2 { font-size: 24px; line-height: normal; letter-spacing: normal; margin: 0; padding: 0; font-family: var(--font-heading); }
h3 { font-size: 20px; line-height: normal; letter-spacing: normal; margin: 0; padding: 0; font-family: var(--font-heading); }
h4 { font-size: 18px; line-height: normal; letter-spacing: normal; margin: 0; padding: 0; font-family: var(--font-heading); }
h5 { font-size: 16px; line-height: normal; letter-spacing: normal; margin: 0; padding: 0; font-family: var(--font-heading); }
h6 { font-size: 14px; line-height: normal; letter-spacing: normal; margin: 0; padding: 0; font-family: var(--font-heading); }

/* Outlook Chart */
.outlook-chart-card { background: #fff; border: 1px solid #e8ecef; border-radius: 12px; padding: 24px 22px 14px; margin: 16px 0 0; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.outlook-chart-header { border-bottom: 1px solid #e8ecef; padding-bottom: 14px; margin-bottom: 14px; }
.outlook-chart-meta { font-family: var(--font-text); font-size: 13px; color: #6b7280; letter-spacing: 0.2px; }

/* Performance Card */
.perf-card { background: #fff; border: 1px solid #e8ecef; border-radius: 12px; padding: 24px 22px 4px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.perf-card-header { border-bottom: 1px solid #e8ecef; padding-bottom: 14px; margin-bottom: 14px; }
.perf-card-title { font-family: var(--font-heading); font-size: 14px; font-weight: 700; letter-spacing: 0.8px; color: #111827; margin-bottom: 7px; text-transform: uppercase; }
.perf-card-meta { font-family: var(--font-text); font-size: 13px; color: #6b7280; letter-spacing: 0.2px; }
.perf-pos { color: #15803d; }
.perf-neg { color: #991b1b; }

/* Dashboard */
.dashboard-row { display: flex; flex-direction: column; align-items: center; gap: 16px; margin: 40px auto 16px; }
.dashboard-row .dashboard-wrapper { margin: 0; width: 100%; max-width: 480px; }
.dashboard-right { display: flex; flex-direction: column; gap: 12px; width: 100%; max-width: 480px; }
.dashboard-right .outlook-chart-card { margin: 0; flex: 0 0 auto; }
.dashboard-right .dashboard-features { margin-top: 0; }
.dashboard-wrapper { max-width: 480px; margin: 40px auto 40px; }
.dashboard-features { display: flex; gap: 12px; margin-top: 12px; }
.dashboard-feature-card { flex: 1; background: #ffffff; border: 1px solid #e8ecef; border-radius: 10px; padding: 16px 18px; text-decoration: none; display: flex; flex-direction: column; box-shadow: 0 2px 8px rgba(0,0,0,0.06); transition: box-shadow 0.2s, border-color 0.2s; }
.dashboard-feature-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.1); border-color: var(--TT-teal); }
.dashboard-feature-title { font-family: var(--font-heading); font-size: 13px; font-weight: 700; color: #111827; margin-bottom: 6px; }
.dashboard-feature-desc { font-family: var(--font-text); font-size: 12px; color: #6b7280; line-height: 1.5; flex: 1; margin-bottom: 12px; }
.dashboard-feature-cta { font-family: var(--font-text); font-size: 12px; font-weight: 700; color: var(--TT-teal); }

/* IFT Card */
.ift-card { background-color: #ffffff; border: 1px solid #e8ecef; border-radius: 12px; padding: 24px 28px 22px; max-width: 100%; box-shadow: 0 2px 12px rgba(0,0,0,0.07); }
.ift-card-header { border-bottom: 1px solid #e8ecef; padding-bottom: 14px; margin-bottom: 18px; }
.ift-card-title, .outlook-chart-title { font-family: var(--font-heading); font-size: 14px; font-weight: 700; letter-spacing: 0.8px; color: #111827; margin-bottom: 7px; text-transform: uppercase; }
.ift-card-meta { font-family: var(--font-text); font-size: 13px; color: #6b7280; letter-spacing: 0.2px; }
.ift-card-dot { margin: 0 6px; }
.ift-card-info-row { display: flex; align-items: center; margin-bottom: 20px; }
.ift-card-info-block { flex: 1; text-align: center; padding: 4px 10px; }
.ift-card-info-divider { width: 1px; height: 60px; background-color: #e8ecef; flex-shrink: 0; }
.ift-info-label { font-family: var(--font-text); font-size: 11px; font-weight: 700; letter-spacing: 0.9px; color: var(--TT-teal); text-transform: uppercase; margin-bottom: 7px; }
.ift-info-value { font-family: var(--font-heading); font-size: 17px; font-weight: 700; color: #111827; margin-bottom: 4px; }
.ift-info-sub { font-family: var(--font-text); font-size: 12px; color: #6b7280; letter-spacing: 0.2px; }
.ift-card-chart-area { border-top: 1px solid #e8ecef; padding-top: 18px; }
.tsp-legend-name { min-width: 58px; }
.tsp-legend-pct { }
.ift-card-notes { border-top: 1px solid #e8ecef; margin-top: 18px; padding-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.ift-card-note { padding-left: 10px; border-left: 2px solid var(--TT-teal); }
.ift-note-label { font-family: var(--font-text); font-size: 10px; font-weight: 700; letter-spacing: 0.8px; text-transform: uppercase; color: var(--TT-teal); margin-bottom: 3px; }
.ift-note-text { font-family: var(--font-text); font-size: 12px; color: #6b7280; line-height: 1.55; }
.column-subs-single form { margin: 20px auto 10px; }
.horizontal-links a:hover { color: var(--hover-color); transition: .25s; }
.inline-links { color: var(--TT-teal); }
.subscriptions p { width: 100%; padding: 0 0 12px; display: block; text-align: center; font-family: var(--font-text); font-weight: 500; font-size: 18px; line-height: 22px; color: #3d3d3d; }
.copyright { padding: 0px; color: hsla(0,0%,40%,1.00); background-color: var(--light-gray-field); }
.copyright a:hover { color: hsla(0,0%,30%,1.00); transition: .25s; }
form { margin: 50px auto; }

/* Newsletter */
.nl-card { background: #fff; border: 1px solid #e8ecef; border-radius: 12px; padding: 32px 36px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.nl-newsletter-header { text-align: center; margin-bottom: 8px; }
.nl-newsletter-header .ift-note-text { margin-top: 6px; }
.nl-divider { border: none; border-top: 1px solid #e8ecef; margin: 24px 0; }
.nl-sub-heading { font-family: var(--font-heading); font-size: 16px; font-weight: 700; color: #374151; margin: 16px 0 8px; }
.nl-funds-intro { color: #6b7280; font-size: 14px; margin-bottom: 8px; }
.nl-fund-heading { font-family: var(--font-heading); font-size: 20px; font-weight: 700; color: #111827; margin: 32px 0 10px; }
.nl-fund-ticker { font-size: 14px; font-weight: 400; color: #6b7280; margin-left: 8px; }
.nl-figure { margin: 16px 0 48px; display: flex; flex-direction: column; }
.column-center .nl-figure .body-image img { margin: 0 auto; }
.column-center .nl-figure .body-image-mobile img { margin: 0 auto; }
.nl-caption { font-family: var(--font-text); font-size: 15px; font-weight: 600; color: #6b7280; text-align: center; margin-bottom: 6px; font-style: italic; order: -1; }
.nl-note-box { background: #fffbeb; border: 1px solid #fde68a; border-radius: 10px; padding: 24px 28px; }
.nl-note-box p { padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid #fde68a; }
.nl-note-box p:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: none; }
.nl-section-header { display: flex; align-items: center; justify-content: space-between; }
.nl-section-header h2 { margin: 0; }
.nl-toggle { background: none; border: none; cursor: pointer; color: #9ca3af; padding: 6px; display: flex; align-items: center; border-radius: 6px; transition: color 0.15s, background-color 0.15s; flex-shrink: 0; }
.nl-toggle:hover { color: #374151; background-color: #f3f4f6; }
.nl-toggle svg { transition: transform 0.2s ease; }
.nl-toggle[aria-expanded="false"] svg { transform: rotate(-90deg); }
.nl-section-body { margin-top: 16px; }
.nl-section-body.nl-collapsed { display: none; }


@media (max-width: 589px) {
  .outlook-chart-wrap { height: 260px; width: 110%; }
  .body-image, .body-image-reduced { display: none; }
  .mobile-header { position: relative; margin: 0 auto 40px; width: 100%; z-index: 4; height: 46px; top: 0px; background-color: var(--header-color); box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1); }
  .mobile-header ul { margin: 0; padding: 0; list-style: none; overflow: hidden; background-color: var(--header-color); }
  .mobile-header li a { display: block; padding: 14px 24px; text-decoration: none; }
  .mobile-header li a:hover { background-color: rgba(255,255,255,0.06); }
  .mobile-header .mobile-dropdown-content { clear: both; max-height: 0; transition: max-height .2s ease-out; }
  .mobile-dropdown-content { height: 100vh; }
  .mobile-dropdown-content a { color: #fff; padding: 14px 24px; text-decoration: none; display: block; font-family: var(--font-text); font-weight: 400; font-size: 16px; border-bottom: 1px solid rgba(255,255,255,0.08); }
  .mobile-menu-divider { margin: 4px 0; }
  .mobile-menu-legal a { color: rgba(255,255,255,0.5); font-size: 13px; border-bottom: none; padding: 10px 24px; }
  .mobile-menu-legal a:hover { color: rgba(255,255,255,0.8); background-color: transparent; }
  .mobile-header .menu-icon { cursor: pointer; display: inline-block; float: left; background-color: var(--header-color); width: 46px; padding: 6px 0px; position: relative; user-select: none; text-align: center; }
  .mobile-header .menu-icon .navicon { background: #ffffff; display: block; height: 2px; position: relative; transition: background .2s ease-out; width: 24px; border-radius: 5px; margin: 10px auto 0; }
  .mobile-header .menu-icon .navicon:before, .mobile-header .menu-icon .navicon:after { background: #ffffff; content: ''; display: block; height: 100%; position: absolute; transition: all .2s ease-out; width: 100%; border-radius: 5px; }
  .mobile-header .menu-icon .navicon:before { top: 5px; }
  .mobile-header .menu-icon .navicon:after { top: -5px; }
  .mobile-header .menu-btn { display: none; }
  .mobile-header .menu-btn:checked ~ .mobile-dropdown-content { max-height: 100vh; }
  .mobile-header .menu-btn:checked ~ .menu-icon .navicon { background: transparent; }
  .mobile-header .menu-btn:checked ~ .menu-icon .navicon:before { transform: rotate(-45deg); }
  .mobile-header .menu-btn:checked ~ .menu-icon .navicon:after { transform: rotate(45deg); }
  .mobile-header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before, .mobile-header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after { top: 0; }
  .mobile-header .menu-icon .menu-label { display: block; font-size: 12px; text-align: center; color: #ffffff; letter-spacing: 0.08em; line-height: 1; margin-top: 10px; font-family: var(--font-text); font-weight: 400; }
  .mobile-header .menu-icon .menu-label--close { display: none; }
  .mobile-header .menu-btn:checked ~ .menu-icon .menu-label--open { display: none; }
  .mobile-header .menu-btn:checked ~ .menu-icon .menu-label--close { display: block; }
  .mobile-logo { position: absolute; left: 54px; top: 6px;}
  .mobile-logo img { height: 36px;}
  .mobile-login { position: absolute; top: 8px; right: 10px; z-index: 6; display: flex; gap: 6px; align-items: center; }
  .mobile-btn-subscribe { color: white; text-decoration: none; padding: 4px 11px; font-family: var(--font-text); font-weight: 600; font-size: 15px; background-color: var(--TT-teal); border-radius: 30px; }
  .mobile-btn-subscribe:hover { background-color: var(--hover-color); transition: .3s; }
  .mobile-btn-login { color: white; text-decoration: none; padding: 4px 11px; font-family: var(--font-text); font-weight: 600; font-size: 15px; background-color: var(--header-color); border-radius: 30px; }
  .mobile-btn-login:hover { color: var(--nav-link-hover); transition: .3s; }
  .primary-header, .secondary-header, .logo img { display: none; }
  .top-space { display: block; margin-bottom: 80px; }
  .column-section { margin: 0 auto 40px; padding: 0 10px 0; display: flex; flex-flow: row wrap; justify-content: center; width: 100%; }
  .column-left { flex: 1; margin: 0; padding: 0; width: 100px; }
  .column-left img { margin: 40px 0 0 55vw; padding: 0 auto; width: 70px; max-height: 70px; display: block; }
  .column-center { flex: none; margin: 0 20px; padding: 0; width: 100%; }
  .column-center .body-image-mobile img { display: block; margin: 40px auto 50px; padding: 0; width: 100%; }
  .subscriptions { display: block; justify-content: center; text-align: center; margin: 10px 0 40px; width: 100%; padding: 0; }
  .column-subs-one { border: 2px solid #c6c6c6; background-color: #f7f7f7; border-radius: 10px; display: inline-block; flex: 1; margin: 10px 30px; padding: 24px 0 14px; width: 220px; }
  .column-subs-single { border: 2px solid #c6c6c6; background-color: #f7f7f7; border-radius: 10px; display: inline-block; flex: 1; margin: 10px 10px; padding: 24px 0 14px; width: 250px; }
  .column-subs-two, .column-subs-three { border: 2px solid #c6c6c6; background-color: #f7f7f7; border-radius: 10px; display: inline-block; flex: 1; margin: 10px 30px; padding: 24px 0 14px; width: 220px; }
  .column-subs-one form, .column-subs-two form, .column-subs-three form { margin: 20px 0 10px; padding: 0; }
  .center-p { padding: 0 20px; text-align: center; margin: 0; color: #000; font-family: var(--font-text); font-weight: 400; font-style: normal; font-size: 16px; line-height: 22px; text-decoration: none; width: 90vw; }
  .color-p-b { font-size: 16px; padding: 20px 0 10px; color: #515151; font-family: var(--font-text); font-weight: bold; font-style: normal; width: 100%; }
  .color-p-b-ind { font-size: 16px; padding: 20px 0 10px 10px; color: #515151; font-family: var(--font-text); font-weight: bold; font-style: normal; width: 100%; }
  .horizontal-links { padding: 8px 0 10px 10px; margin: 0 auto; width: 90vw; }
  .horizontal-links a { padding: 0 16px 14px 0; color: var(--TT-teal); font-family: var(--font-text); font-weight: 700; font-size: 14px; letter-spacing: .25px; text-decoration: none; text-transform: uppercase; text-align: left; display: block; }
  footer { position: relative; bottom: 0px; padding: 20px; width: 100%; background-color: var(--light-gray-field); text-align: center; }
  .copyright p { text-align: center; font-family: var(--font-text); font-weight: 400; font-style: normal; font-size: 13px; line-height: 16px; letter-spacing: 0.25px; margin: 0 auto; width: 90%; padding-top: 8px; }
  .copyright a { text-align: center; font-family: var(--font-text); text-decoration: none; color: hsla(0,0%,50%,1.00); display: inline; padding-top: 0; margin: 0 auto; line-height: 30px; font-size: 14px; }
  .confirmationspace { margin: 10vh 0 0; width: 90vw; padding: 0; text-align: center; }
  .confirmationspace h2 { margin: 10vh auto 30px; width: 240px; padding: 0; line-height: 24px; text-align: center; }
  .confirmationspace p { width: 270px; margin: 0 auto; text-align: center; }
  textarea { width: 90vw; height: 150px; padding: 12px 20px; box-sizing: border-box; border: 2px solid #ccc; background-color: #fff; font-size: 14px; resize: none; }
  .text-message-form { display: block; position: relative; border: 0.4px solid #dbdbdb; padding: 20px; margin: 70px auto 60px; width: 80vw; border-radius: 6px; background-color: #fafafa; }
  .text-message-form p { position: relative; margin: 0 10px 10px; padding: 0; top: -6px; left: 2px; color: var(--TT-teal); font-family: var(--font-text); font-weight: 400; font-style: italic; line-height: 36px; font-size: 20px; width: auto; text-transform: uppercase; }
  .text-message-form a { display: block; color: white; font-family: var(--font-text); font-weight: 400; font-size: 14px; padding: 13px 43px; width: 210px; margin: 0 auto 3px; font-style: normal; border-radius: 3px; box-shadow: 3px 3px 5px #33333370; letter-spacing: 0.5px; border: 0.4px solid #6d6d6d; background-image: linear-gradient(-10deg,var(--TT-teal),var(--TT-teal)); text-decoration: none; cursor: pointer; text-align: center; }
  .performance-large { display: none; }
  .performance-small { width: 100%; margin: 16px 0 0; }
  .performance-small .chart-container { position: relative; width: 100%; height: 260px; }
  .tsp-chart-container { position: relative; width: 250px; margin: 0px auto;}
  .tsp-chart-flex { display: flex; align-items: center; gap: 34px; }
  .tsp-pie-wrap { flex: 0 0 auto; width: 120px; height: 120px; }
  .tsp-legend { display: flex; flex-direction: column; gap: 13px; }
  .tsp-legend-item { display: flex; align-items: center; gap: 10px; }
  .tsp-legend-swatch { width: 13px; height: 13px; border-radius: 3px; flex-shrink: 0; }
  .tsp-legend-text { font-family: var(--font-text); font-size: 15px; line-height: 1; }
}


@media (min-width: 590px) {
  .outlook-chart-wrap { height: 260px; }
  .body-image-mobile { display: none; }
  .mobile-header { position: relative; margin: 0 auto 40px; width: 100%; z-index: 4; height: 46px; top: 0px; background-color: var(--header-color); box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1); }
  .mobile-header ul { margin: 0; padding: 0; list-style: none; overflow: hidden; background-color: var(--header-color); }
  .mobile-header li a { display: block; padding: 14px 24px; text-decoration: none; }
  .mobile-header li a:hover { background-color: rgba(255,255,255,0.06); }
  .mobile-header .mobile-dropdown-content { clear: both; max-height: 0; transition: max-height .2s ease-out; }
  .mobile-dropdown-content { height: 100vh; }
  .mobile-dropdown-content a { color: #fff; padding: 14px 24px; text-decoration: none; display: block; font-family: var(--font-text); font-weight: 400; font-size: 16px; border-bottom: 1px solid rgba(255,255,255,0.08); }
  .mobile-menu-divider { margin: 4px 0; }
  .mobile-menu-legal a { color: rgba(255,255,255,0.5); font-size: 13px; border-bottom: none; padding: 10px 24px; }
  .mobile-menu-legal a:hover { color: rgba(255,255,255,0.8); background-color: transparent; }
  .mobile-header .menu-icon { cursor: pointer; display: inline-block; float: left; background-color: var(--header-color); width: 46px; padding: 6px 0px; position: relative; user-select: none; text-align: center; }
  .mobile-header .menu-icon .navicon { background: #ffffff; display: block; height: 2px; position: relative; transition: background .2s ease-out; width: 24px; border-radius: 5px; margin: 10px auto 0; }
  .mobile-header .menu-icon .navicon:before, .mobile-header .menu-icon .navicon:after { background: #ffffff; content: ''; display: block; height: 100%; position: absolute; transition: all .2s ease-out; width: 100%; border-radius: 5px; }
  .mobile-header .menu-icon .navicon:before { top: 5px; }
  .mobile-header .menu-icon .navicon:after { top: -5px; }
  .mobile-header .menu-btn { display: none; }
  .mobile-header .menu-btn:checked ~ .mobile-dropdown-content { max-height: 100vh; }
  .mobile-header .menu-btn:checked ~ .menu-icon .navicon { background: transparent; }
  .mobile-header .menu-btn:checked ~ .menu-icon .navicon:before { transform: rotate(-45deg); }
  .mobile-header .menu-btn:checked ~ .menu-icon .navicon:after { transform: rotate(45deg); }
  .mobile-header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before, .mobile-header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after { top: 0; }
  .mobile-header .menu-icon .menu-label { display: block; font-size: 12px; text-align: center; color: #ffffff; letter-spacing: 0.08em; line-height: 1; margin-top: 10px; font-family: var(--font-text); font-weight: 400; }
  .mobile-header .menu-icon .menu-label--close { display: none; }
  .mobile-header .menu-btn:checked ~ .menu-icon .menu-label--open { display: none; }
  .mobile-header .menu-btn:checked ~ .menu-icon .menu-label--close { display: block; }
  .mobile-logo { position: absolute; left: 56px; top: 6px;}
  .mobile-logo img { height: 36px;}
  .mobile-login { position: absolute; top: 8px; right: 20px; z-index: 6; display: flex; gap: 8px; align-items: center; }
  .mobile-btn-subscribe { color: white; text-decoration: none; padding: 5px 14px; font-family: var(--font-text); font-weight: 600; font-size: 15px; background-color: var(--TT-teal); border-radius: 30px; }
  .mobile-btn-subscribe:hover { background-color: var(--hover-color); transition: .3s; }
  .mobile-btn-login { color: white; text-decoration: none; padding: 5px 14px; font-family: var(--font-text); font-weight: 600; font-size: 15px; background-color: var(--header-color); border-radius: 30px; }
  .mobile-btn-login:hover { color: var(--nav-link-hover); transition: .3s; }
  .primary-header, .secondary-header, .logo img { display: none; }
  .top-space { display: block; margin-bottom: 80px; }
  .column-section { margin: 0 auto 50px; padding: 0; display: flex; flex-flow: row wrap; justify-content: center; width: 100%; }
  .column-left { flex: 1; margin: 0; padding: 0; width: 100px; }
  .column-left img { margin: 50px 0 0 50px; padding: 0 auto; width: 70px; max-height: 70px; display: block; }
  .column-center { flex: none; margin: 0 auto; padding: 0; width: 540px; }
  .column-center .body-image { display: block; }
  .column-center .body-image img { margin: 50px auto 70px; max-width: 100%; display: block; padding: 0; }
  .column-center .body-image-reduced { display: block; }
  .column-center .body-image-reduced img { margin: 50px auto 70px; max-width: 75%; display: block; padding: 0; }
  .subscriptions { display: block; justify-content: center; text-align: center; margin: 0 0 40px; width: 100%; padding: 0; }
  .column-subs-one { border: 2px solid #c6c6c6; background-color: #f7f7f7; border-radius: 10px; display: inline-block; flex: 1; margin: 10px 10px; padding: 24px 0 14px; width: 180px; }
  .column-subs-single { border: 2px solid #c6c6c6; background-color: #f7f7f7; border-radius: 10px; display: inline-block; flex: 1; margin: 10px 10px; padding: 24px 0 14px; width: 380px; }
  .column-subs-two, .column-subs-three { border: 2px solid #c6c6c6; background-color: #f7f7f7; border-radius: 10px; display: inline-block; flex: 1; margin: 10px 10px; padding: 24px 0 14px; width: 180px; }
  .column-subs-one form, .column-subs-two form, .column-subs-three form { margin: 20px 0 10px; padding: 0; }
  .center-p { padding: 0 20px 10px; text-align: center; margin: 0 auto; color: #000; font-family: var(--font-text); font-weight: 400; font-style: normal; font-size: 16px; line-height: 22px; text-decoration: none; width: 100%; }
  .color-p-b { font-size: 16px; padding: 20px 0 10px; color: #515151; font-family: var(--font-text); font-weight: bold; font-style: normal; }
  .color-p-b-ind { font-size: 16px; padding: 20px 0 10px 20px; color: #515151; font-family: var(--font-text); font-weight: bold; font-style: normal; }
  .horizontal-links { padding: 8px 0 10px 12px; margin: 0 auto; width: 100%; }
  .horizontal-links a { padding: 0 18px 14px 0; color: var(--TT-teal); font-family: var(--font-text); font-weight: 700; font-size: 14px; letter-spacing: .25px; text-decoration: none; text-transform: uppercase; text-align: left; display: block; }
  footer { position: relative; bottom: 0px; padding: 20px; width: 100%; background-color: var(--light-gray-field); color: #9b9b9b; text-align: center; }
  .copyright p { text-align: center; font-family: var(--font-text); font-weight: 400; font-style: normal; font-size: 13px; line-height: 16px; letter-spacing: 0.25px; margin: 0 auto; width: 540px; padding-top: 8px; }
  .copyright a { text-align: center; font-family: var(--font-text); text-decoration: none; color: hsla(0,0%,50%,1.00); display: inline; padding-top: 0; margin: 0 auto; line-height: 30px; font-size: 14px; }
.confirmationspace { margin: 14vh auto 0; width: 500px; padding: 0; text-align: center; }
  .confirmationspace h2 { margin: 10vh auto 30px; width: 500px; padding: 0; line-height: 24px; text-align: center; }
  .confirmationspace p { width: 400px; margin: 0 auto; text-align: center; }
  textarea { width: 600px; height: 150px; padding: 12px 20px; box-sizing: border-box; border: 2px solid #ccc; background-color: #fff; font-size: 14px; resize: none; }
  .text-message-form { display: block; position: relative; border: 0.4px solid #dbdbdb; padding: 20px; margin: 50px auto 0; width: 100%; border-radius: 6px; background-color: #fafafa; }
  .text-message-form p { position: relative; margin: 0 10px 0; padding: 0; top: -6px; left: 2px; color: var(--TT-teal); font-family: var(--font-text); font-weight: 400; font-style: italic; line-height: 36px; font-size: 20px; width: auto; text-transform: uppercase; }
  .text-message-form a { display: block; color: white; font-family: var(--font-text); font-weight: 400; font-size: 15px; padding: 13px 43px; width: 232px; margin: 0 auto 3px; font-style: normal; border-radius: 3px; box-shadow: 3px 3px 5px #33333370; letter-spacing: 0.5px; border: 0.4px solid #6d6d6d; background-image: linear-gradient(-10deg,var(--TT-teal),var(--TT-teal)); text-decoration: none; cursor: pointer; text-align: center; }
  .performance-large { display: none; }
  .performance-small { width: 100%; margin: 16px 0 0; }
  .performance-small .chart-container { position: relative; width: 100%; height: 340px; }
  .tsp-chart-container { position: relative; width: 310px; margin: 0px auto;}
  .tsp-chart-flex { display: flex; align-items: center; gap: 48px; }
  .tsp-pie-wrap { flex: 0 0 auto; width: 150px; height: 150px; }
  .tsp-legend { display: flex; flex-direction: column; gap: 13px; }
  .tsp-legend-item { display: flex; align-items: center; gap: 10px; }
  .tsp-legend-swatch { width: 13px; height: 13px; border-radius: 3px; flex-shrink: 0; }
  .tsp-legend-text { font-family: var(--font-text); font-size: 15px; line-height: 1; }
}


@media (min-width: 900px) {
  .dashboard-row { display: grid; grid-template-columns: 480px 400px; column-gap: 20px; margin: 40px auto 16px; justify-content: center; align-items: stretch; }
  .dashboard-row .dashboard-wrapper { margin: 0; height: 100%; }
  .dashboard-row .ift-card { height: 100%; display: flex; flex-direction: column; box-sizing: border-box; }
  .dashboard-row .ift-card-chart-area { flex: 1; display: flex; align-items: center; justify-content: center; }
  .dashboard-right { width: 400px; }
  .dashboard-right .outlook-chart-card { flex: 0 0 auto; }
  .outlook-chart-wrap { height: 174px; }
  .mobile-header, .body-image-mobile { display: none; }
  header { width: 100%; background-color: var(--header-color); margin-left: auto; margin-right: auto; border-bottom-width: 0; padding-left: 0; padding-top: 0; padding-right: 0; padding-bottom: 0px; }
  .primary-header { display: block; position: relative; width: 720px; padding-top: 18px; height: 40px; margin: 0 auto 40px; }
  .nav-link-left { display: inline; text-align: left; position: relative; bottom: 8px; margin: 0 0 0 30px; }
  .nav-link-left a { margin: 0; padding: 18px 12px; color: var(--nav-link); text-decoration: none; font-family: var(--font-text); font-weight: 400; letter-spacing: 0; font-size: 15px; }
  .nav-link-left a:hover { color: var(--nav-link-hover); transition: .3s; }
  .nav-link-right { display: flex; flex-direction: row; align-items: center; gap: 8px; position: absolute; right: 0; top: 28px; transform: translateY(0%); }
  .nav-link-right-1 { color: white; text-decoration: none; padding: 6px 18px; font-family: var(--font-text); font-weight: 600; font-size: 15px; background-color: var(--TT-teal); border-radius: 30px; }
  .nav-link-right-1:hover { background-color: var(--hover-color); transition: .3s; }
  .nav-link-right-login { color: white; text-decoration: none; padding: 6px 18px; font-family: var(--font-text); font-weight: 600; font-size: 15px; background-color: var(--header-color); border-radius: 30px; }
  .nav-link-right-login:hover { color: var(--nav-link-hover); transition: .3s; }
  .logo { display: inline; }
  .logo img { display: inline; width: 90px; padding: 0; margin: 0 auto; }
  .mobile-logo, .mobile-login { display: none; }
  .column-section { margin: 0 auto; display: flex; flex-flow: row wrap; justify-content: center; width: 100%; background-color: white; padding: 40px 0; }
  .column-left { flex: 1; margin: 0; padding: 0; width: 300px; }
  .column-left img { margin: 120px 40px 0 80px; padding: 0 auto; width: 80px; max-height: 80px; display: block; }
  .column-center { flex: none; margin: 0 auto; padding: 0; width: 720px; }
  .column-subs-one { border: 2px solid #c6c6c6; background-color: #f7f7f7; border-radius: 10px; display: inline-block; flex: 1; margin: 10px 10px; padding: 24px 0 14px; width: 200px; }
  .column-subs-two, .column-subs-three { border: 2px solid #c6c6c6; background-color: #f7f7f7; border-radius: 10px; display: inline-block; flex: 1; margin: 10px 10px; padding: 24px 0 14px; width: 200px; }
  .column-subs-one form, .column-subs-two form, .column-subs-three form { margin: 20px 0 10px; padding: 0; }
  .center-p { padding: 0 0 10px; text-align: center; color: #000; font-family: var(--font-text); font-weight: 400; font-style: normal; font-size: 16px; line-height: 24px; text-decoration: none; width: auto; }
  .color-p-b { font-size: 16px; padding: 20px 0 10px; color: #515151; font-family: var(--font-text); font-weight: bold; font-style: normal; }
  .color-p-b-ind { font-size: 16px; padding: 20px 0 10px 20px; color: #515151; font-family: var(--font-text); font-weight: bold; font-style: normal; }
  .horizontal-links { padding: 10px 0 12px 14px; margin: 0 auto; width: auto; }
  .horizontal-links a { padding: 0 18px 14px 0; color: var(--TT-teal); font-family: var(--font-text); font-weight: 700; font-size: 14px; letter-spacing: .25px; text-decoration: none; text-transform: uppercase; display: inline-block; }
  footer { position: relative; bottom: 0px; padding: 20px; width: 100%; background-color: var(--light-gray-field); text-decoration: none; }
  .copyright p { text-align: center; font-family: var(--font-text); font-weight: 400; font-style: normal; font-size: 13px; line-height: 16px; letter-spacing: 0.25px; margin: 0 auto; width: 800px; padding-top: 8px; }
  .copyright a { text-align: center; font-family: var(--font-text); text-decoration: none; color: hsla(0,0%,50%,1.00); display: inline; padding-top: 0; margin: 0 auto; line-height: 30px; font-size: 14px; }
.confirmationspace { margin: 14vh auto 0; width: 650px; padding: 0; text-align: center; }
  .confirmationspace h2 { margin: 10vh auto 30px; width: 600px; padding: 0; line-height: 24px; text-align: center; }
  .confirmationspace p { width: 550px; margin: 0 auto; text-align: center; }
  textarea { width: 700px; height: 150px; padding: 12px 20px; box-sizing: border-box; border: 2px solid #ccc; background-color: #fff; font-size: 14px; resize: none; }
  .text-message-form { display: block; position: relative; border: 0.4px solid #dbdbdb; padding: 20px; margin: 50px auto 0; width: 580px; border-radius: 6px; background-color: #fafafa; }
  .performance-small { display: none; }
  .performance-large { display: block; width: 100%; margin: 16px 0 0; }
  .performance-large .chart-container { position: relative; width: 100%; height: 400px; }
}


@media (min-width: 1200px) {
  .dashboard-row { grid-template-columns: 480px 480px; }
  .dashboard-right { width: 480px; }
  .mobile-header, .body-image-mobile { display: none; }
  .primary-header { display: block; position: relative; width: 1140px; padding-top: 18px; height: 40px; margin: 0 auto 40px; }
  .nav-link-left { display: inline; text-align: left; position: relative; bottom: 8px; margin: 0 0 0 60px; }
  .nav-link-left a { margin: 0; padding: 30px; color: var(--nav-link); text-decoration: none; font-family: var(--font-text); font-weight: 400; letter-spacing: 0; font-size: 15px; }
  .column-left { flex: 1; margin: 0; padding: 0; }
  .column-left img { margin: 130px auto 0 80px; padding: 0 auto; width: 100px; max-height: 100px; display: block; }
  .column-center { flex: none; margin: 0 auto; padding: 0; width: 1140px; }
  .column-subs-two { border: 2px solid #c6c6c6; background-color: #f7f7f7; border-radius: 10px; display: inline-block; flex: 1; margin: 10px 40px; padding: 24px 0 14px; width: 200px; }
  .column-subs-three { border: 2px solid #c6c6c6; background-color: #f7f7f7; border-radius: 10px; display: inline-block; flex: 1; margin: 10px 10px; padding: 24px 0 14px; width: 200px; }
  .center-p { padding: 0 0 12px; text-align: center; color: #000; font-family: var(--font-text); font-weight: 400; font-style: normal; font-size: 16px; line-height: 24px; text-decoration: none; width: auto; }
  .color-p-b { font-size: 16px; padding: 20px 0 12px; color: #515151; font-family: var(--font-text); font-weight: bold; font-style: normal; }
  .color-p-b-ind { font-size: 16px; padding: 20px 0 12px 20px; color: #515151; font-family: var(--font-text); font-weight: bold; font-style: normal; }
  .horizontal-links { padding: 12px 0 14px 16px; margin: 0 auto; width: auto; }
  .horizontal-links a { padding: 0 20px 14px 0; color: var(--TT-teal); font-family: var(--font-text); font-weight: 700; font-size: 14px; letter-spacing: .25px; text-decoration: none; text-transform: uppercase; display: inline-block; }
  .copyright p { text-align: center; font-family: var(--font-text); font-weight: 400; font-style: normal; font-size: 13px; line-height: 16px; letter-spacing: 0.25px; margin: 0 auto; width: 1140px; padding-top: 8px; }
  .copyright a { text-decoration: none; color: hsla(0,0%,50%,1.00); display: inline; padding-top: 10px; margin: 0 auto; line-height: 30px; font-size: 14px; }
.confirmationspace { margin: 14vh auto 0; width: 600px; text-align: center; }
  .confirmationspace h2 { margin: 50px 0 40px; }
  .confirmationspace p { width: 550px; text-align: center; margin: auto; }
  .text-message-form { display: block; position: relative; border: 0.4px solid #dbdbdb; padding: 20px; margin: 70px auto -40px; width: 630px; border-radius: 6px; background-color: #fafafa; }
  .performance-large .chart-container { position: relative; width: 100%; height: 440px; }
}


@media (min-width: 1800px) {
  .primary-header { display: block; position: relative; width: 1320px; padding-top: 18px; height: 40px; margin: 0 auto 40px; }
  .column-left img { margin: 150px auto 0 130px; padding: 0 auto; width: 120px; max-height: 120px; display: block; }
  .column-center { flex: none; margin: 0 auto; padding: 0; width: 1320px; }
  .column-center .body-image img { margin: 50px auto 70px; max-width: 90%; display: block; padding: 0; }
  .column-subs-one form, .column-subs-two form, .column-subs-three form { margin: 20px 0; padding: 0; }
  .center-p { padding: 0; text-align: center; color: #000; font-family: var(--font-text); font-weight: 400; font-style: normal; font-size: 16px; line-height: 0; text-decoration: none; width: auto; }
  .horizontal-links { padding: 14px 0 16px 18px; margin: 0 auto; width: auto; }
  .horizontal-links a { padding: 0 22px 16px 0; color: var(--TT-teal); font-family: var(--font-text); font-weight: 700; font-size: 14px; letter-spacing: .25px; text-decoration: none; text-transform: uppercase; display: inline-block; }
  .copyright p { text-align: center; font-family: var(--font-text); font-weight: 400; font-style: normal; font-size: 13px; line-height: 16px; letter-spacing: 0.25px; margin: 0 auto; width: 1320px; padding-top: 8px; }
  .text-message-form { display: block; position: relative; border: 0.4px solid #dbdbdb; padding: 20px; margin: 70px auto -30px; width: 630px; border-radius: 6px; background-color: #fafafa; }
  .performance-large .chart-container { position: relative; width: 100%; height: 480px; }
}


/* Guarantee box (subscriptions + index) */
.guarantee-box { display: flex; align-items: flex-start; gap: 14px; background: #f0faf9; border: 1px solid #a7d9d5; border-radius: 8px; padding: 16px 18px; margin: 16px 0; }
.guarantee-icon { font-size: 28px; line-height: 1; flex-shrink: 0; margin-top: 2px; }
.guarantee-box-text strong { display: block; font-family: var(--font-heading); font-size: 15px; color: #0d3b37; margin-bottom: 4px; }
.guarantee-box-text p { font-size: 13px; color: #4b7572; line-height: 1.6; margin: 0; }

/* Benefits grid (index + subscriptions) */
.benefits-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 16px 0 20px; width: 100%; max-width: 100%; box-sizing: border-box; }
.benefit-card { background: #f8f9fa; border: 1px solid #e0e0e0; border-radius: 6px; padding: 14px 16px; }
.benefit-card-title { font-family: var(--font-heading); font-size: 14px; font-weight: 700; color: #111827; margin-bottom: 5px; }
.benefit-card-desc { font-size: 13px; color: #6b7280; line-height: 1.55; }
@media (max-width: 540px) { .benefits-grid { grid-template-columns: 1fr; } }

/* Subscriptions page */
.benefits-list { list-style: none; padding: 0; margin: 16px 0 0; }
.benefits-list li { display: flex; align-items: flex-start; gap: 10px; padding: 7px 0; font-size: 15px; color: #374151; border-top: 1px solid #e8ecef; }
.benefits-list li:first-child { border-top: none; }
.benefits-list li::before { content: "\2713"; color: var(--TT-teal); font-weight: 700; flex-shrink: 0; margin-top: 1px; }
.plan-cards { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; margin: 24px 0 20px; }
.plan-card { flex: 1; min-width: 200px; max-width: 260px; background: #fff; border: 1px solid #e0e0e0; border-radius: 10px; padding: 24px 20px 18px; text-align: center; position: relative; box-shadow: 0 2px 6px rgba(0,0,0,0.05); }
.plan-card--featured { border: 2px solid var(--TT-teal); }
.plan-badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--TT-teal); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; padding: 3px 12px; border-radius: 20px; white-space: nowrap; font-family: var(--font-text); }
.plan-name { font-size: 16px; font-weight: 700; color: #111827; font-family: var(--font-heading); margin-bottom: 10px; }
.plan-price { font-size: 32px; font-weight: 700; color: #0d3b37; font-family: var(--font-text); line-height: 1.1; }
.plan-price-note { font-size: 12px; color: #9ca3af; margin: 4px 0 16px; font-family: var(--font-text); }
.plan-card form { margin: 0 auto 12px; }
.plan-renewal { font-size: 12px; color: #6b7280; margin-top: 8px; font-family: var(--font-text); }
.sub-testimonial { border-left: 3px solid var(--TT-teal); margin: 24px 0 0; padding: 12px 18px; background: #f2f6f6; font-style: italic; font-size: 15px; color: #374151; line-height: 1.7; border-radius: 0 4px 4px 0; }
.sub-testimonial cite { display: block; margin-top: 8px; font-style: normal; font-size: 13px; font-weight: 700; color: var(--TT-teal); font-family: var(--font-text); }
.guarantee-note { font-size: 14px; color: #374151; margin: 0 0 12px; line-height: 1.6; }
.payment-info { font-size: 14px; color: #555; line-height: 1.6; margin: 0 0 16px; }
.trust-badges { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 16px; margin: 16px 0 0; }
.card-badges { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: center; }
.card-badges img { height: 26px; width: auto; border-radius: 4px; }
.after-purchase-list { list-style: none; padding: 0; margin: 16px 0 0; }
.after-purchase-list li { padding: 10px 0; border-top: 1px solid #e8ecef; font-size: 15px; color: #374151; line-height: 1.6; }
.after-purchase-list li:first-child { border-top: none; padding-top: 4px; }
.after-purchase-list li strong { display: block; color: #111827; margin-bottom: 3px; font-family: var(--font-text); }
#mc_embed_signup { background: #fff; border: 1px solid #e8ecef; border-radius: 12px; padding: 28px 32px 24px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
#mc_embed_signup h2 { font-family: var(--font-heading); font-size: 20px; font-weight: 700; color: #111827; margin: 0 0 8px; }
#mc_embed_signup p { font-size: 14px; color: #6b7280; line-height: 1.6; margin: 0 0 18px; }
#mc_embed_signup form { margin: 0; }
.mc-signup-row { display: flex; gap: 10px; align-items: flex-end; }
.mc-field-group { flex: 1; }
.mc-field-group label { display: block; font-family: var(--font-text); font-size: 13px; font-weight: 600; color: #374151; margin-bottom: 5px; }
.mc-field-group input[type="email"] { display: block; width: 100%; padding: 10px 14px; font-family: var(--font-text); font-size: 15px; color: #111827; border: 1px solid #d1d5db; border-radius: 6px; outline: none; transition: border-color 0.15s; }
.mc-field-group input[type="email"]:focus { border-color: var(--TT-teal); box-shadow: 0 0 0 2px rgba(31,153,143,0.12); }
#mc-embedded-subscribe { padding: 10px 22px; background: var(--TT-teal); color: #fff; font-family: var(--font-text); font-size: 15px; font-weight: 700; border: none; border-radius: 6px; cursor: pointer; transition: background 0.15s; white-space: nowrap; }
#mc-embedded-subscribe:hover { background: var(--hover-color); }
#mce-error-response { color: #991b1b; font-size: 14px; margin-top: 10px; }
#mce-success-response { color: #15803d; font-size: 14px; margin-top: 10px; }
.paypal-btn { display: block; width: 100%; padding: 11px 0; background: #1f998f; color: #fff; font-family: var(--font-text); font-size: 15px; font-weight: 700; border: none; border-radius: 5px; cursor: pointer; margin: 4px 0 0; transition: background 0.15s; }
.paypal-btn:hover { background: #198077; }

@media (max-width: 589px) {
  .mc-signup-row { flex-direction: column; align-items: stretch; }
  #mc-embedded-subscribe { width: 100%; padding: 11px 0; }
}