/* Kitty Notes Pro v3 - longform + FAQ */
.article-content .deep-dive,
.article-content .article-plan,
.article-content .article-mistakes,
.article-content .article-monitor,
.article-content .article-faq {
  margin-top: 3.2rem;
  scroll-margin-top: 100px;
}

.article-content .deep-dive p,
.article-content .article-monitor p {
  margin: 0 0 1.1rem;
  line-height: 1.82;
}

.article-plan .steps {
  display: grid;
  gap: .8rem;
  padding: 0;
  margin: 1.2rem 0 0;
  list-style: none;
  counter-reset: kitty-step;
}

.article-plan .steps li {
  position: relative;
  padding: 1rem 1rem 1rem 3.5rem;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
  line-height: 1.65;
  counter-increment: kitty-step;
}

.article-plan .steps li::before {
  content: counter(kitty-step);
  position: absolute;
  left: 1rem;
  top: 1rem;
  display: grid;
  width: 1.75rem;
  height: 1.75rem;
  place-items: center;
  border-radius: 50%;
  background: var(--text);
  color: var(--bg);
  font-size: .78rem;
  font-weight: 900;
}

.article-mistakes ul,
.article-monitor ul {
  display: grid;
  gap: .75rem;
  padding-left: 1.2rem;
  line-height: 1.72;
}

.article-faq .faq-intro {
  margin-bottom: 1.2rem;
  color: var(--muted);
  line-height: 1.7;
}

.faq-list {
  display: grid;
  gap: .65rem;
}

.faq-list details {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
}

.faq-list summary {
  position: relative;
  padding: 1rem 3rem 1rem 1rem;
  cursor: pointer;
  font-weight: 800;
  line-height: 1.45;
  list-style: none;
}

.faq-list summary::-webkit-details-marker { display: none; }

.faq-list summary::after {
  content: '+';
  position: absolute;
  right: 1rem;
  top: .86rem;
  color: var(--orange);
  font-size: 1.35rem;
  font-weight: 500;
}

.faq-list details[open] summary::after { content: '−'; }

.faq-list .faq-answer {
  padding: 0 1rem 1.05rem;
  color: var(--muted);
  line-height: 1.75;
}

.faq-list .faq-answer p { margin: 0 0 .8rem; }
.faq-list .faq-answer p:last-child { margin-bottom: 0; }

.longform-note {
  margin-top: 1.4rem;
  padding: 1rem 1.1rem;
  border-left: 3px solid var(--orange);
  border-radius: 0 14px 14px 0;
  background: color-mix(in srgb, var(--orange) 8%, var(--panel));
  color: var(--muted);
  line-height: 1.65;
}

@media (max-width: 760px) {
  .article-plan .steps li { padding-left: 3.25rem; }
  .faq-list summary { padding-right: 2.8rem; }
}

.article-scenarios { margin-top: 3.2rem; scroll-margin-top: 100px; }
.scenario-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; margin-top:1rem; }
.scenario-card { padding:1rem; border:1px solid var(--line); border-radius:18px; background:var(--panel); }
.scenario-card h3 { margin:0 0 .55rem; font-size:1rem; }
.scenario-card p { margin:0; color:var(--muted); line-height:1.65; }
@media (max-width:900px){ .scenario-grid{grid-template-columns:1fr;} }

.article-owner-note { margin-top:3.2rem; padding:1.2rem; border:1px solid var(--line); border-radius:20px; background:var(--panel); }
.article-owner-note p { line-height:1.78; }
.article-owner-note ul { display:grid; gap:.55rem; padding-left:1.2rem; line-height:1.65; }