/* /tdt (The Disciplined Trader). Loaded after styles.css; only used on this page.
   Same system, calmer psychology feel: soft sand accent, slow concentric "breathing" rings in the hero. */
.page-tdt { --sand: #D8C3A5; --sand-line: rgba(216, 195, 165, .22); }
.page-tdt a.wordmark { text-decoration: none; }

/* Hero */
.page-tdt .hero__glow {
  background:
    radial-gradient(ellipse 50% 42% at 68% 42%, rgba(216, 195, 165, .14), transparent 70%),
    radial-gradient(ellipse 40% 30% at 12% 8%, rgba(201, 169, 97, .06), transparent 70%);
}
.tdt-rings {
  position: absolute; z-index: -1; pointer-events: none; width: 760px; height: 760px; right: -260px; top: 40px;
  background: repeating-radial-gradient(circle at center, transparent 0 46px, rgba(216, 195, 165, .07) 46px 47px);
  -webkit-mask-image: radial-gradient(circle, #000 30%, transparent 70%); mask-image: radial-gradient(circle, #000 30%, transparent 70%);
  animation: breathe 9s ease-in-out infinite;
}
@keyframes breathe { 0%, 100% { transform: scale(1); opacity: .8; } 50% { transform: scale(1.05); opacity: 1; } }
.page-tdt .eyebrow { color: var(--sand); }
.page-tdt h1 em { color: var(--sand); }
.page-tdt .hero__visual { max-width: 280px; }
.page-tdt .hero__visual img { border-radius: 18px; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .9), 0 0 0 1px var(--sand-line); }
.page-tdt .hero .lede { font-size: 1.06rem; }
.page-tdt .cta-wrap { margin-top: 4px; }

/* "Look inside" heading: always one line. The text is ~11.4em wide in Cormorant,
   so 6.6vw fits within the 20px side gutters at any phone width (incl. 360px). */
.page-tdt #look h2 { font-size: clamp(1rem, 6.6vw, 3.1rem); white-space: nowrap; }

/* Body copy */
.tdt-body { margin-top: 20px; font-size: 1.1rem; line-height: 1.75; color: var(--cream-muted); }
.tdt-sub { margin-top: 10px; font-size: .78rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--sand); }
.tdt-h3 { margin-top: 56px; font-size: 1.7rem; }

/* Is / isn't */
.tdt-isnt { display: grid; gap: 14px; max-width: 860px; margin: 36px auto 0; }
.tdt-isnt__item { display: flex; gap: 16px; align-items: flex-start; padding: 22px 22px; border-radius: var(--radius); border: 1px solid var(--line); }
.tdt-isnt__item p { font-size: 1.02rem; }
.tdt-isnt__item--no { background: var(--lift); border-color: rgba(245, 241, 232, .1); }
.tdt-isnt__item--no p { color: var(--cream-muted); }
.tdt-isnt__item--yes { background: linear-gradient(180deg, rgba(216, 195, 165, .08), rgba(216, 195, 165, .02)); border-color: var(--sand-line); }
.tdt-isnt__icon { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; font-size: .8rem; font-weight: 700; }
.tdt-isnt__item--no .tdt-isnt__icon { color: var(--cream-muted); border: 1px solid rgba(245, 241, 232, .3); }
.tdt-isnt__item--yes .tdt-isnt__icon { color: var(--black); background: var(--sand); }

/* Parts */
.tdt-parts { display: grid; gap: 14px; margin-top: 36px; }
.tdt-part { padding: 24px 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); }
.tdt-part__label { font-size: .72rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--sand); }
.tdt-part h3 { font-size: 1.55rem; margin-top: 4px; }
.tdt-part ol { margin: 14px 0 0; padding-left: 1.6em; display: grid; gap: 6px; color: var(--cream-muted); font-size: .96rem; }
.tdt-part li::marker { color: var(--gold); font-family: var(--serif); font-weight: 600; font-variant-numeric: lining-nums; }

/* Tools */
.tdt-tools { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.tdt-tools li { display: grid; place-items: center; padding: 16px 14px; border: 1px solid var(--sand-line); border-radius: 12px; text-align: center; font-weight: 700; font-size: .92rem; background: rgba(216, 195, 165, .04); }

/* Callout */
.tdt-callout { max-width: 640px; margin: 40px auto 0; padding: 22px 24px; border-left: 2px solid var(--sand); background: rgba(216, 195, 165, .05); border-radius: 0 12px 12px 0; }
.tdt-callout__label { font-size: .72rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--sand); margin-bottom: 6px; }
.tdt-callout p:last-child { font-family: var(--serif); font-size: 1.35rem; line-height: 1.4; }

/* Learn */
.tdt-learn { max-width: 560px; margin: 28px auto 0; gap: 14px; }
.tdt-learn li { font-size: 1.04rem; color: var(--cream); }
.page-tdt .ticks li::before { border-color: var(--sand); }

/* CTA + cross-sell */
.tdt-cta { max-width: 460px; margin: 0 auto; }
.tdt-cta .btn { width: 100%; }
.tdt-cross { margin-top: 48px; padding: 20px 22px; border: 1px solid var(--line); border-radius: var(--radius); text-align: center; font-size: .95rem; color: var(--cream-muted); }
.tdt-cross a { color: var(--gold-soft); font-weight: 700; text-underline-offset: 4px; }
.tdt-cross a:hover, .tdt-cross a:focus-visible { color: var(--gold); }

/* Sticky bar */
.page-tdt .stickybar__price { font-size: 1.5rem; }

@media (min-width: 700px) {
  .tdt-isnt { grid-template-columns: 1fr 1fr; }
  .tdt-parts { grid-template-columns: 1fr 1fr; }
  .tdt-tools { grid-template-columns: repeat(4, 1fr); }
  .tdt-cta .btn { width: auto; }
}
@media (min-width: 960px) {
  .page-tdt .hero__visual { max-width: 500px; }
  .tdt-rings { width: 1000px; height: 1000px; right: -200px; top: -60px; }
}
@media (prefers-reduced-motion: reduce) { .tdt-rings { animation: none; } }
