/*
Theme Name: STTW Clean
Theme URI: https://stepstothewealth.com/
Description: Clean-room child theme for Newspaper with custom header and footer only.
Author: Steps to the Wealth
Template: Newspaper
Version: 1.0.4
Text Domain: sttw-clean
*/

/* FORCE AUTHOR SECTION BACKGROUND TO WHITE - MAXIMUM SPECIFICITY */
html body.single-post .td-post-author-name,
html body.single-post .tdb-author-box,
html body.single-post .tdb-author-box-wrap,
html body.single-post .tdb-author-box .tdb-author-bg,
html body.single-post .tdb-author-box .tdb-author-info,
html body.single-post .td_block_author,
html body.single-post .tdb_single_author,
html body.single-post .tdb-author-box .tdb-author-name,
html body.single-post .tdb-author-box .tdb-author-url,
html body.single-post .tdb-author-box .tdb-author-descr {
    background: #ffffff !important;
    background-color: #ffffff !important;
}

/* Main content column on single posts */
body.single-post .td-ss-main-content {
    background: #fff !important;
    background-color: #fff !important;
}

/* Ensure inner elements don't show beige through transparent backgrounds */
.single-post .td-post-featured-image,
.single-post .wpb_wrapper,
.single-post .td_block_wrap,
.single-post .wpb_content_element,
.single-post .tdb_single_content,
.single-post .tdb_single_content .tdb-block-inner {
    background: transparent !important;
}

/* CRITICAL FIX: Override the beige body background on single posts */
/* The header.css sets body { background: var(--bg) } = #F7F4EE which bleeds through */
body.single {
    background-color: #fff !important;
}

/* === Force white background on the post-bottom footer wrappers === */
/* TagDiv wraps tags + sharing + prev-next in <footer> with beige bg */
html body.single-post article > footer,
html body.single-post article footer,
html body.single-post .post > footer,
html body.single-post footer.td-post-source-tags,
html body.single-post footer.entry-footer,
html body.single-post .td-post-content ~ footer,
html body.single-post .td-post-source-tags,
html body.single-post .td-post-source-tags > *,
html body.single-post .td-tags-and-social-wrapper-box,
html body.single-post .td-post-sharing,
html body.single-post .td-post-sharing-bottom,
html body.single-post .td-post-next-prev,
html body.single-post .td-post-next-prev-wrap,
html body.single-post .td-post-next-prev-content,
html body.single-post .td-author-box-wrap,
html body.single-post .author-box-wrap,
html body.single-post .td_block_authors_box,
html body.single-post .tdb-author-box-wrap,
html body.single-post .tdb_single_post_share,
html body.single-post .tdb_single_tags,
html body.single-post .tdb_single_next_prev_post,
html body.single-post .tdb_single_author_box,
html body.single-post .td-block-row {
    background: #ffffff !important;
    background-color: #ffffff !important;
}

/* === Reduce vertical spacing above and below the Tags row by 50% === */
html body.single-post article > footer,
html body.single-post .td-post-source-tags,
html body.single-post .td-tags-and-social-wrapper-box,
html body.single-post .tdb_single_tags {
    margin-top: 12px !important;
    margin-bottom: 12px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

/* STTW: remove TagDiv raw-HTML block bottom gap (global fix 2026-06-23) */
.td_block_wrap.vc_raw_html {
    margin-bottom: 0;
}

/* ==========================================================================
   CUSTOM LANDING PAGES (Upgrade & Operator's Mindset)
   Moved from inline <style> blocks to child theme to prevent tagDiv
   minifier/compiler conflicts.
   ========================================================================== */

/* --- UPGRADE PAGE (.sttw) --- */
/* Collapse the default gap WordPress/Gutenberg adds between Custom HTML blocks */
.wp-block-html,
.wp-block-html .wp-block,
.wp-block + .wp-block-html,
.wp-block-html + .wp-block-html,
.wp-block-html > *:first-child { margin-top: 0 !important; margin-bottom: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; }
/* TagDiv composer row spacing */
.td-block-row .td-block-col > .wpb_wrapper > .wpb_raw_html,
.wpb_raw_html { margin-bottom: 0 !important; }
/* TagDiv block wrap gap */
.td_block_wrap { margin-bottom: 0 !important; padding-bottom: 0 !important; }

.sttw {
  --paper: #f3efe5;
  --paper-2: #ebe5d6;
  --ink: #161310;
  --ink-2: #4a443c;
  --ink-3: #8a8275;
  --rule: #d8d0bd;
  --accent: #2c4a33;
  --accent-ink: #f5f0df;
  --display: "Source Serif 4", "Iowan Old Style", Georgia, serif;
  --sans: "Geist", -apple-system, "Helvetica Neue", Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;
  --maxw: 1180px;
  --gutter: clamp(20px, 4vw, 64px);
}
.sttw * { box-sizing: border-box; }
.sttw, .sttw { margin: 0; padding: 0; }
.sttw {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 400;
  font-size: 18px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "cv11";
}
.sttw a { color: inherit; }
.sttw .masthead {
  border-bottom: 1px solid var(--rule);
  padding: 18px var(--gutter);
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-2);
}
.sttw .masthead .lockup { display: flex; align-items: center; gap: 14px; }
.sttw .masthead .mark {
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--accent);
  display: inline-grid; place-items: center;
  color: var(--accent-ink); font-family: var(--display); font-style: italic;
  font-weight: 600; font-size: 14px; line-height: 1;
  padding-bottom: 2px;
}
.sttw .masthead nav { display: flex; gap: 28px; }
.sttw .masthead nav a { text-decoration: none; opacity: 0.7; }
.sttw .masthead nav a:hover { opacity: 1; }
.sttw .masthead .meta { color: var(--ink-3); }
@media (max-width: 720px) { .sttw .masthead nav, .sttw .masthead .meta { display: none; } }
.sttw .ribbon {
  background: var(--ink);
  color: var(--paper);
  text-align: center;
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 9px var(--gutter);
}
.sttw .ribbon .dot { color: var(--accent); display: inline-block; margin: 0 10px; transform: translateY(-1px); }
.sttw .wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter); }
.sttw .eyebrow {
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-3);
  display: inline-flex; align-items: center; gap: 10px;
}
.sttw .eyebrow::before {
  content: ""; width: 22px; height: 1px; background: var(--ink-3); display: inline-block;
}
.sttw .display {
  font-family: var(--display);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.06;
  color: var(--ink);
}
.sttw .lede { font-size: 21px; line-height: 1.55; color: var(--ink-2); max-width: 60ch; }
.sttw .rule { border-top: 1px solid var(--rule); }
.sttw .rule-section { border-top: 1px solid var(--rule); margin: 0 var(--gutter); }
.sttw .btn {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 16px 22px;
  background: var(--ink); color: var(--paper);
  font-family: var(--sans); font-weight: 500; font-size: 15px;
  letter-spacing: 0.01em;
  text-decoration: none;
  border: 1px solid var(--ink);
  transition: transform .15s ease, background .15s ease;
}
.sttw .btn:hover { background: #000; transform: translateY(-1px); }
.sttw .btn .arrow { font-family: var(--display); font-style: italic; transition: transform .2s ease; }
.sttw .btn:hover .arrow { transform: translate(3px, 0); }
.sttw .btn--accent { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.sttw .btn--accent:hover { background: #1f3625; }
.sttw .btn--ghost { background: transparent; color: var(--ink); border: 1px solid var(--ink); }
.sttw .btn--ghost:hover { background: var(--ink); color: var(--paper); }
.sttw .hero { padding: 96px 0 88px; }
.sttw .hero h1 {
  font-size: clamp(46px, 7.4vw, 104px);
  margin: 18px 0 8px;
}
.sttw .hero h1 em { font-style: italic; font-weight: 400; color: var(--accent); }
.sttw .hero h2 {
  font-family: var(--display);
  font-weight: 300;
  font-style: italic;
  font-size: clamp(26px, 3.2vw, 40px);
  line-height: 1.15;
  color: var(--ink-2);
  margin: 0 0 36px;
  max-width: 28ch;
  letter-spacing: -0.01em;
}
.sttw .hero p { margin: 0 0 18px; max-width: 62ch; color: var(--ink-2); font-size: 18.5px; }
.sttw .hero .cta-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 36px; }
.sttw .hero .trial-note {
  font-family: var(--mono); font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-3); margin-top: 22px;
}
.sttw .trial-note .pip { color: var(--accent); }
/* footer.js splits the note into .ti spans. Desktop: inline, middot-separated. */
.sttw .hero .trial-note .pip { margin-right: .5em; }
.sttw .hero .trial-note .ti + .ti::before { content: "\00B7"; margin: 0 .55em; color: currentColor; opacity: .65; }
/* Mobile: one item per line for legibility. */
@media (max-width: 620px) {
  .sttw .hero .trial-note { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
  .sttw .hero .trial-note .pip { display: none; }
  .sttw .hero .trial-note .ti + .ti::before { content: none; }
}
.sttw .hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 80px;
  align-items: end;
}
@media (max-width: 980px) { .sttw .hero-grid { grid-template-columns: 1fr; gap: 48px; } }
.sttw .issue {
  border: 1px solid var(--rule);
  background: #fbf8ef;
  padding: 26px 24px 22px;
  position: relative;
  font-size: 13.5px;
}
.sttw .issue::before {
  content: "SAMPLE";
  position: absolute; top: -10px; left: 18px;
  background: var(--paper); padding: 0 8px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .2em; color: var(--ink-3);
}
.sttw .issue .iss-mast {
  display: flex; justify-content: space-between;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink-3); padding-bottom: 12px; border-bottom: 1px solid var(--rule);
}
.sttw .issue .iss-title {
  font-family: var(--display); font-size: 26px; line-height: 1.1; letter-spacing: -0.01em;
  margin: 14px 0 16px;
}
.sttw .issue .iss-title em { font-style: italic; color: var(--accent); }
.sttw .iss-row {
  display: grid; grid-template-columns: 44px 1fr 56px;
  gap: 10px; align-items: baseline;
  padding: 8px 0; border-bottom: 1px dotted var(--rule);
  font-family: var(--mono); font-size: 12px;
}
.sttw .iss-row:last-child { border-bottom: 0; }
.sttw .iss-row .sym { letter-spacing: .12em; }
.sttw .iss-row .name { color: var(--ink-2); text-transform: uppercase; letter-spacing: .12em; font-size: 10.5px; }
.sttw .iss-row .read { justify-self: end; text-transform: uppercase; letter-spacing: .12em; font-weight: 500; }
.sttw .read.high { color: #9a3a1c; }
.sttw .read.elev { color: #8a6a14; }
.sttw .read.neut { color: var(--ink-2); }
.sttw .read.low { color: var(--accent); }
.sttw .section { padding: 96px 0; }
.sttw .section--alt { background: var(--paper-2); }
.sttw .section-head { display: grid; grid-template-columns: 1fr 1.4fr; gap: 60px; margin-bottom: 56px; align-items: end; }
@media (max-width: 820px) { .sttw .section-head { grid-template-columns: 1fr; gap: 24px; } }
.sttw .section-head h2 {
  font-family: var(--display); font-weight: 400; letter-spacing: -0.02em;
  font-size: clamp(36px, 4.6vw, 60px);
  line-height: 1.08;
  margin: 14px 0 0;
}
.sttw .section-head h2 em { font-style: italic; color: var(--accent); }
.sttw .section-head p { margin: 0; color: var(--ink-2); font-size: 18px; max-width: 48ch; }
.sttw .features { display: grid; grid-template-columns: 1fr; }
.sttw .feature {
  display: grid;
  grid-template-columns: 80px 1fr 1.1fr;
  gap: 40px;
  padding: 36px 0;
  border-top: 1px solid var(--rule);
  align-items: start;
}
.sttw .feature:last-child { border-bottom: 1px solid var(--rule); }
.sttw .feature .num {
  font-family: var(--mono); font-size: 13px; letter-spacing: .12em; color: var(--ink-3);
  padding-top: 6px;
}
.sttw .feature h3 {
  font-family: var(--display); font-weight: 400;
  font-size: clamp(26px, 2.6vw, 34px); line-height: 1.12; letter-spacing: -0.01em;
  margin: 0; max-width: 22ch;
}
.sttw .feature h3 em { font-style: italic; color: var(--accent); }
.sttw .feature p {
  margin: 0; color: var(--ink-2); font-size: 17px; line-height: 1.62;
  max-width: 46ch;
}
@media (max-width: 820px) {
  .sttw .feature { grid-template-columns: 56px 1fr; }
  .sttw .feature p { grid-column: 1 / -1; }
}
.sttw .pricing { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--rule); background: #fbf8ef; }
@media (max-width: 820px) { .sttw .pricing { grid-template-columns: 1fr; } }
.sttw .plan { padding: 44px 40px 40px; position: relative; }
.sttw .plan + .plan { border-left: 1px solid var(--rule); }
@media (max-width: 820px) { .sttw .plan + .plan { border-left: 0; border-top: 1px solid var(--rule); } }
.sttw .plan .tag {
  font-family: var(--mono); font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--ink-3);
}
.sttw .plan .price {
  font-family: var(--display); font-size: 64px; line-height: 1; letter-spacing: -0.02em;
  margin: 12px 0 0; display: flex; align-items: baseline; gap: 10px;
}
.sttw .plan .price .per { font-family: var(--sans); font-size: 16px; color: var(--ink-2); font-weight: 400; }
.sttw .plan .save {
  font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--accent); margin-top: 10px;
}
.sttw .plan h3 {
  font-family: var(--display); font-style: italic; font-weight: 400;
  font-size: 24px; margin: 28px 0 6px; color: var(--ink);
}
.sttw .plan p { color: var(--ink-2); margin: 0 0 28px; font-size: 16.5px; max-width: 34ch; }
.sttw .plan .btn { width: 100%; justify-content: space-between; }
/* Mobile: ThriveCart sets width:100% + justify-content:space-between INLINE on the
   plan buttons, so in the narrow single-column card the 15px label is stretched and
   wraps, reading oversized (the 06/anchor buttons are auto-width and look fine).
   Shrink the label, tighten padding, and center it (override the inline value) so it
   sits on one line / wraps cleanly. */
@media (max-width: 620px) {
  .sttw .plan { padding: 32px 22px 30px; }
  .sttw .plan .btn {
    padding: 14px 16px;
    gap: 6px;
    justify-content: center !important;
    text-align: center;
  }
  /* ThriveCart sets the label size on the inner plaintext <span>, so the button's
     own font-size doesn't cascade — force the span (and arrow) smaller directly. */
  .sttw .plan .btn,
  .sttw .plan .btn span { font-size: 12.5px !important; letter-spacing: 0 !important; }
}
.sttw .plan .corner {
  position: absolute; top: 20px; right: 20px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-3);
}
.sttw .trial-strip {
  margin-top: 24px; padding: 18px 24px; border: 1px dashed var(--rule);
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  font-size: 14.5px; color: var(--ink-2);
}
.sttw .trial-strip strong { color: var(--ink); font-weight: 500; }
.sttw .trial-strip .sep { color: var(--ink-3); }
.sttw .who-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
@media (max-width: 820px) { .sttw .who-grid { grid-template-columns: 1fr; } }
.sttw .who-col { padding: 40px 44px 44px; }
.sttw .who-col + .who-col { border-left: 1px solid var(--rule); }
@media (max-width: 820px) { .sttw .who-col + .who-col { border-left: 0; border-top: 1px solid var(--rule); } }
.sttw .who-col h3 {
  font-family: var(--display); font-weight: 400; font-style: italic;
  font-size: 30px; margin: 0 0 6px; letter-spacing: -0.01em;
}
.sttw .who-col .who-sub { font-family: var(--mono); font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 22px; }
.sttw .who-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }
.sttw .who-list li {
  padding-left: 28px; position: relative; color: var(--ink-2); font-size: 16.5px; line-height: 1.5;
}
.sttw .who-list li::before {
  content: ""; position: absolute; left: 0; top: 11px; width: 14px; height: 1px; background: var(--accent);
}
.sttw .who-col--no .who-list li::before { background: var(--ink-3); }
.sttw .who-col--no .who-sub { color: var(--ink-3); }
.sttw .nots { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
@media (max-width: 980px) { .sttw .nots { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .sttw .nots { grid-template-columns: 1fr; } }
.sttw .not {
  padding: 32px 28px;
  border-right: 1px solid var(--rule);
}
.sttw .not:last-child { border-right: 0; }
@media (max-width: 980px) {
  .sttw .not:nth-child(2n) { border-right: 0; }
  .sttw .not:nth-child(-n+2) { border-bottom: 1px solid var(--rule); }
}
@media (max-width: 560px) {
  .sttw .not { border-right: 0; border-bottom: 1px solid var(--rule); }
  .sttw .not:last-child { border-bottom: 0; }
}
.sttw .not .ix { font-family: var(--mono); font-size: 11.5px; letter-spacing: .14em; color: var(--ink-3); }
.sttw .not h4 { font-family: var(--display); font-style: italic; font-weight: 400; font-size: 24px; margin: 10px 0 10px; letter-spacing: -0.01em; }
.sttw .not p { margin: 0; color: var(--ink-2); font-size: 15.5px; line-height: 1.55; }
.sttw .faq { border-top: 1px solid var(--rule); }
.sttw details.faq-item {
  border-bottom: 1px solid var(--rule);
  padding: 26px 0;
}
.sttw details.faq-item summary {
  list-style: none; cursor: pointer;
  display: grid; grid-template-columns: 60px 1fr 24px; gap: 24px; align-items: baseline;
}
.sttw details.faq-item summary::-webkit-details-marker { display: none; }
.sttw details.faq-item .qnum { font-family: var(--mono); font-size: 12px; letter-spacing: .12em; color: var(--ink-3); }
.sttw details.faq-item .q {
  font-family: var(--display); font-size: clamp(22px, 2.1vw, 28px); line-height: 1.2; letter-spacing: -0.01em;
  color: var(--ink); font-weight: 400;
}
.sttw details.faq-item .plus {
  justify-self: end; font-family: var(--display); font-size: 26px; line-height: 1;
  transition: transform .25s ease; color: var(--accent);
}
.sttw details.faq-item[open] .plus { transform: rotate(45deg); }
.sttw details.faq-item .a {
  padding: 14px 0 0 84px;
  color: var(--ink-2);
  max-width: 70ch;
  font-size: 17px; line-height: 1.6;
}
.sttw details.faq-item .a a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 720px) {
  .sttw details.faq-item summary { grid-template-columns: 1fr 24px; gap: 14px; }
  .sttw details.faq-item .qnum { display: none; }
  .sttw details.faq-item .a { padding-left: 0; }
}
.sttw .anchor {
  background: var(--ink); color: var(--paper); padding: 110px 0 100px;
}
.sttw .anchor .eyebrow { color: rgba(245,240,223,.55); }
.sttw .anchor .eyebrow::before { background: rgba(245,240,223,.4); }
.sttw .anchor h2 {
  font-family: var(--display); font-weight: 400; letter-spacing: -0.02em;
  font-size: clamp(40px, 5.8vw, 76px); line-height: 1.1; margin: 18px 0 36px;
  max-width: 22ch;
}
.sttw .anchor h2 em { font-style: italic; color: #c9b87a; }
.sttw .anchor p {
  color: rgba(245,240,223,.8); font-size: 19px; line-height: 1.6; max-width: 56ch; margin: 0 0 18px;
}
.sttw .anchor .cta-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 38px; }
.sttw .anchor .btn { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.sttw .anchor .btn:hover { background: #fff; }
.sttw .anchor .btn--accent { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.sttw .anchor .btn--accent:hover { background: #1f3625; }
.sttw .anchor .price-tag {
  display: inline-flex; align-items: baseline; gap: 14px;
  font-family: var(--mono); font-size: 12px; letter-spacing: .18em; text-transform: uppercase;
  color: rgba(245,240,223,.6); margin-top: 28px;
}
.sttw footer {
  padding: 36px var(--gutter);
  border-top: 1px solid var(--rule);
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-3);
  display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap;
}
.sttw footer .disclaim { max-width: 72ch; text-transform: none; letter-spacing: 0; font-family: var(--sans); font-style: italic; color: var(--ink-2); font-size: 14px; }
body.compact .sttw .hero { padding: 64px 0 56px; }
.sttw.compact .section { padding: 64px 0; }
.sttw.compact .anchor { padding: 80px 0 76px; }
.sttw.compact .feature { padding: 26px 0; }
.sttw ::selection { background: var(--accent); color: var(--accent-ink); }
.sttw .hero { background: var(--ink); color: #F1EFE8; border-bottom: 1px solid rgba(255,255,255,0.10); }
.sttw .hero .eyebrow { color: rgba(245,240,223,0.62); }
.sttw .hero .eyebrow::before { background: rgba(245,240,223,0.45); }
.sttw .hero h1, .sttw .hero .display { color: #FBFAF6 !important; }
.sttw .hero h1 em { color: #7FBE9B !important; }
.sttw .hero h2 { color: rgba(245,240,223,0.86); }
.sttw .hero p { color: rgba(245,240,223,0.76); }
.sttw .hero .btn--accent { background: #FBFAF6; border-color: #FBFAF6; color: var(--ink); }
.sttw .hero .btn--accent:hover { background: #FFFFFF; border-color: #FFFFFF; }
.sttw .hero .btn--ghost { background: transparent; color: #FBFAF6; border-color: rgba(255,255,255,0.30); }
.sttw .hero .btn--ghost:hover { background: rgba(255,255,255,0.06); color: #FBFAF6; }
.sttw .hero .btn .arrow { color: inherit; }
.sttw .hero .trial-note { color: rgba(245,240,223,0.62); }
.sttw .hero .trial-note .pip { color: #7FBE9B; }
.sttw .hero .issue { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.12); color: #F1EFE8; box-shadow: none; }
.sttw .hero .issue::before { background: #1B1C16; color: rgba(245,240,223,0.55); }
.sttw .hero .issue .iss-mast { color: rgba(245,240,223,0.62); border-bottom-color: rgba(255,255,255,0.12); }
.sttw .hero .issue .iss-title { color: #FBFAF6; }
.sttw .hero .issue .iss-title em { color: #7FBE9B; }
.sttw .hero .iss-row { border-bottom-color: rgba(255,255,255,0.12); }
.sttw .hero .iss-row .sym { color: #F1EFE8; }
.sttw .hero .iss-row .name { color: rgba(245,240,223,0.70); }
.sttw .hero .read.high { color: #E6916F; }
.sttw .hero .read.elev { color: #D9B45C; }
.sttw .hero .read.neut { color: rgba(245,240,223,0.72); }
.sttw .hero .read.low { color: #7FBE9B; }
.sttw { position: relative; width: 100vw; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; box-sizing: border-box; }
.sttw .btn { border-radius: 999px; }
.sttw .news-input, .sttw .news-input button { border-radius: 999px; }


/* --- /newsletter/ page (self-styled inline, NOT .sttw-scoped) ---
   The "02 / Reading preview" feature wraps its reading list in an unclassed <div>,
   so the page's own "@media(820px){ .feature .reading-list{grid-column:1/-1} }" rule
   never reaches it: the wrapper drops into the narrow 56px first column on mobile and
   squashes the list (BTC/ETH/... overlap). Pull that wrapper full-width on mobile.
   :has() scopes this to exactly the reading-list block, so no other .feature is hit.
   (style.css is enqueued site-wide as td-theme-css, so it applies to /newsletter/.) */
@media (max-width: 820px) {
  .feature > div:has(> .reading-list) { grid-column: 1 / -1; }
}


/* --- OPERATOR'S MINDSET PAGE (.mc) --- */
.mc {
  --bg: #F7F4EE; --bg-2: #EFEBE2; --paper: #FBFAF6;
  --ink: #14150F; --ink-2: #2C2E27; --ink-3: #6B6D63;
  --rule: #1415140F; --rule-strong: #1415142A;
  --accent: oklch(0.46 0.10 152); --accent-ink: #F5F2EA;
  --accent-hi: #7FBE9B;
  --f-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-serif: "Source Serif 4", "Iowan Old Style", Georgia, serif;
  --f-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  position: relative; width: 100vw; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw;
  background: var(--bg); color: var(--ink); font-family: var(--f-sans);
  padding: 88px 24px; border-top: 1px solid var(--rule); box-sizing: border-box;
}
.mc.band-alt { background: var(--bg-2); }
.mc.band-dark { background: var(--ink); color: #F1EFE8; border-top: 1px solid rgba(255,255,255,0.08); }
.mc * { box-sizing: border-box; }
.mc .wrap { max-width: 1180px; margin: 0 auto; padding: 0; }
.mc .narrow { max-width: 760px; }

/* section head */
.mc .sec-head { display: grid; grid-template-columns: 0.62fr 1fr; gap: 48px; align-items: end; margin-bottom: 46px; }
.mc .eyebrow { display: inline-flex; align-items: center; gap: 10px; font-family: var(--f-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
.mc .eyebrow::before { content: ""; width: 24px; height: 1px; background: var(--ink-3); }
.mc.band-dark .eyebrow { color: rgba(245,240,223,0.62); }
.mc.band-dark .eyebrow::before { background: rgba(245,240,223,0.45); }
.mc .sec-title { margin: 12px 0 0; font-family: var(--f-serif); font-weight: 400; font-size: clamp(32px, 4.4vw, 54px); line-height: 1.04; letter-spacing: -0.02em; text-wrap: balance; }
.mc .sec-title em { font-style: italic; color: var(--accent); }
.mc.band-dark .sec-title { color: #FBFAF6; }
.mc.band-dark .sec-title em { color: var(--accent-hi); }
.mc .lede { font-size: 17px; line-height: 1.5; color: var(--ink-2); max-width: 58ch; }
.mc.band-dark .lede { color: rgba(245,240,223,0.78); }

/* prose */
.mc .prose p { font-size: 16px; line-height: 1.6; color: var(--ink-2); margin: 0 0 14px; max-width: 66ch; }
.mc .prose p em { font-style: normal; color: var(--ink); font-weight: 600; }
.mc .prose .callout { font-family: var(--f-serif); font-style: italic; font-size: 20px; line-height: 1.3; color: var(--ink); margin: 18px 0; }
.mc.band-dark .prose p { color: rgba(245,240,223,0.78); }

/* buttons (pill-rounded) */
.mc .btn { display: inline-flex; align-items: center; gap: 10px; height: 50px; padding: 0 24px; border-radius: 999px; font-family: var(--f-sans); font-size: 15px; font-weight: 600; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: transform .15s ease, background .15s ease, border-color .15s ease; }
.mc .btn .arr { font-family: var(--f-mono); }
.mc .btn--accent { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.mc .btn--accent:hover { transform: translateY(-1px); background: oklch(0.40 0.10 152); }
.mc .btn--ghost { background: transparent; color: var(--ink); border-color: var(--rule-strong); }
.mc .btn--ghost:hover { border-color: var(--ink); }
.mc.band-dark .btn--accent { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.mc.band-dark .btn--accent:hover { background: #FFFFFF; }
.mc.band-dark .btn--ghost { color: #FBFAF6; border-color: rgba(245,240,223,0.30); }
.mc.band-dark .btn--ghost:hover { border-color: #FBFAF6; background: rgba(245,240,223,0.06); }
.mc .meta { font-family: var(--f-mono); font-size: 12px; color: var(--ink-3); }
.mc.band-dark .meta { color: rgba(245,240,223,0.55); }

/* hero */
.mc .hero-grid { display: grid; grid-template-columns: 1.08fr 0.92fr; gap: 52px; align-items: center; }
.mc .hero-h1 { font-family: var(--f-serif); font-weight: 400; font-size: clamp(40px, 5.4vw, 76px); line-height: 1.05; letter-spacing: -0.025em; margin: 0; max-width: 16ch; text-wrap: balance; color: #FBFAF6; }
.mc .hero-h1 em { font-style: italic; color: var(--accent-hi); }
.mc .hero-sub { margin-top: 24px; font-size: 18px; line-height: 1.55; color: rgba(245,240,223,0.78); max-width: 52ch; }
.mc .pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.mc .pills span { font-family: var(--f-mono); font-size: 11px; letter-spacing: .04em; color: rgba(245,240,223,0.70); border: 1px solid rgba(245,240,223,0.20); border-radius: 999px; padding: 6px 12px; }
.mc .cta-row { margin-top: 32px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.mc .stack { position: relative; border: 1px solid rgba(245,240,223,0.16); border-radius: 12px; background: linear-gradient(135deg, #1B1C16 0%, #14150F 100%); aspect-ratio: 4/3; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: rgba(245,240,223,0.5); box-shadow: 0 30px 80px rgba(0,0,0,0.45); }
.mc .stack b { font-family: var(--f-serif); font-size: 16px; color: rgba(245,240,223,0.7); }
.mc .stack span { font-family: var(--f-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }

/* generic card grid */
.mc .grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.mc .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.mc .card { background: var(--paper); border: 1px solid var(--rule-strong); border-radius: 8px; padding: 24px 22px; }
.mc .card .k { font-family: var(--f-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.mc .card h3 { margin: 10px 0 6px; font-family: var(--f-serif); font-weight: 500; font-size: 20px; line-height: 1.2; letter-spacing: -0.01em; }
.mc .card h3 em { font-style: italic; color: var(--accent); }
.mc .card p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--ink-2); }

/* what's inside - arc labels + module list */
.mc .arc { font-family: var(--f-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin: 34px 0 4px; }
.mc .arc:first-child { margin-top: 0; }
.mc .arc b { color: var(--accent); font-weight: 600; }
.mc .modules { border-top: 1px solid var(--rule-strong); }
.mc .module { display: grid; grid-template-columns: 64px 1fr; gap: 20px; padding: 22px 0; border-bottom: 1px solid var(--rule); align-items: start; }
.mc .module .mnum { font-family: var(--f-mono); font-size: 13px; color: var(--accent); padding-top: 3px; }
.mc .module h4 { margin: 0 0 5px; font-family: var(--f-serif); font-weight: 500; font-size: 19px; letter-spacing: -0.01em; }
.mc .module p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--ink-2); max-width: 64ch; }
.mc .deliverables { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.mc .deliverables span { font-family: var(--f-mono); font-size: 12px; color: var(--ink-2); border: 1px solid var(--rule-strong); border-radius: 999px; padding: 7px 14px; }

/* who-for two columns */
.mc .fit { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.mc .fit-col { background: var(--paper); border: 1px solid var(--rule-strong); border-radius: 8px; padding: 26px 24px; }
.mc .fit-col.yes { border-top: 2px solid var(--accent); }
.mc .fit-col .lab { font-family: var(--f-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 10px; }
.mc .fit-col h3 { margin: 0 0 16px; font-family: var(--f-serif); font-weight: 400; font-size: 23px; }
.mc .fit-col h3 em { font-style: italic; color: var(--accent); }
.mc .fit-col.no h3 em { color: var(--ink-3); }
.mc .fit-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.mc .fit-col li { position: relative; padding-left: 24px; font-size: 14px; line-height: 1.5; color: var(--ink-2); }
.mc .fit-col.yes li::before { content: "\2713"; position: absolute; left: 0; color: var(--accent); font-weight: 700; }
.mc .fit-col.no li::before { content: "\2715"; position: absolute; left: 0; color: var(--ink-3); font-weight: 700; }

/* pricing card (single $99 tier) */
.mc .price-wrap { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 32px; align-items: center; }
.mc .price-card { background: var(--paper); border: 1.5px solid var(--accent); border-radius: 10px; padding: 32px 30px; box-shadow: 0 18px 50px -28px rgba(20,21,15,0.20); }
.mc .price-card .tag { font-family: var(--f-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.mc .price-card .price { display: flex; align-items: baseline; gap: 8px; margin: 8px 0 2px; }
.mc .price-card .price b { font-family: var(--f-serif); font-weight: 600; font-size: 56px; line-height: 1; letter-spacing: -0.02em; }
.mc .price-card .price small { color: var(--ink-3); font-size: 15px; }
.mc .price-card .save { font-family: var(--f-mono); font-size: 12px; color: var(--accent); margin-bottom: 20px; }
.mc .price-card ul { list-style: none; padding: 0; margin: 0 0 24px; display: grid; gap: 10px; }
.mc .price-card li { position: relative; padding-left: 24px; font-size: 14.5px; line-height: 1.45; color: var(--ink-2); }
.mc .price-card li::before { content: "\2713"; position: absolute; left: 0; color: var(--accent); font-weight: 700; }
.mc .price-card .btn { width: 100%; justify-content: center; }
.mc .price-note { font-family: var(--f-mono); font-size: 11px; color: var(--ink-3); margin-top: 14px; line-height: 1.5; }
.mc .price-side h3 { font-family: var(--f-serif); font-weight: 400; font-size: 28px; line-height: 1.1; letter-spacing: -0.01em; margin: 0 0 12px; }
.mc .price-side h3 em { font-style: italic; color: var(--accent); }
.mc .price-side p { font-size: 15px; line-height: 1.55; color: var(--ink-2); margin: 0 0 12px; max-width: 42ch; }

/* faq */
.mc .faq { border-top: 1px solid var(--rule-strong); }
.mc .q { border-bottom: 1px solid var(--rule); }
.mc .q summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 64px 1fr 28px; align-items: baseline; gap: 16px; padding: 22px 0; }
.mc .q summary::-webkit-details-marker { display: none; }
.mc .q .n { font-family: var(--f-mono); font-size: 12px; letter-spacing: .06em; color: var(--ink-3); }
.mc .q .qtext { font-family: var(--f-serif); font-size: 21px; line-height: 1.2; letter-spacing: -0.01em; color: var(--ink); }
.mc .q .qtext em { font-style: italic; color: var(--accent); }
.mc .q .plus { font-family: var(--f-mono); font-size: 22px; color: var(--ink-3); justify-self: end; transition: transform .2s ease; }
.mc .q[open] .plus { transform: rotate(45deg); }
.mc .q .answer { padding: 0 0 24px 80px; }
.mc .q .answer p { margin: 0 0 12px; font-size: 15.5px; line-height: 1.6; color: var(--ink-2); max-width: 70ch; }
.mc .q .answer p:last-child { margin-bottom: 0; }

/* final cta */
.mc .final { text-align: center; max-width: 720px; margin: 0 auto; }
.mc .final .price-tag { font-family: var(--f-mono); font-size: 13px; color: rgba(245,240,223,0.6); margin-top: 22px; display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

@media(max-width: 920px) {
  .mc .hero-grid, .mc .grid-3, .mc .grid-2, .mc .fit, .mc .price-wrap { grid-template-columns: 1fr; gap: 28px; }
  .mc .sec-head { grid-template-columns: 1fr; gap: 16px; }
}
@media(max-width: 620px) {
  .mc .q summary { grid-template-columns: 1fr 24px; }
  .mc .q .n { display: none; }
  .mc .q .answer { padding-left: 0; }
  .mc .module { grid-template-columns: 1fr; gap: 8px; }
}

/* ==========================================================================
   EMBED MODE - ?embed=1
   --------------------------------------------------------------------------
   Strips the site chrome so a tool page can be iframed into a ThriveCart Learn
   lesson. TC Learn is not WordPress, so course lessons cannot run a [shortcode];
   they iframe these pages instead. Inside the iframe the header, primary nav,
   sidebar and footer are noise and steal vertical space from the calculator.

   Selectors below are the real rendered wrappers (TagDiv Newspaper + this child
   theme), confirmed against the served markup - not assumed. The sidebar rule
   also has to widen the content column, because Newspaper's content/sidebar
   split is a fixed 8/4 grid: hiding the sidebar alone would leave the tool
   sitting in a 690px column with a third of the page empty beside it.
   ========================================================================== */
.sttw-embed .td-header-wrap,
.sttw-embed .td-header-menu-wrap-full,
.sttw-embed #sttw-primary-nav,
.sttw-embed .td-footer-page,
.sttw-embed .td-footer-container,
.sttw-embed .td-sub-footer-container,
.sttw-embed .td-main-sidebar {
    display: none !important;
}

.sttw-embed .td-pb-span8,
.sttw-embed .td-pb-span12 {
    width: 100% !important;
    float: none !important;
}

.sttw-embed .td-main-content-wrap,
.sttw-embed .td-container,
.sttw-embed .td-pb-row {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.sttw-embed body,
.sttw-embed #td-outer-wrap {
    background: transparent !important;
}