/* article-specific rules only — base template in article-base.css */

.art-prose h2 { text-align: justify }
.art-prose h3 { text-align: justify }

/* TECH STACK */
.tech-stack { background: var(--s2); border-radius: var(--rl); padding: 1.5rem; margin: 2rem 0 }
.ts-label { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--ink3); margin-bottom: 0.8rem }
.ts-items { display: flex; flex-wrap: wrap; gap: 0.5rem }
.ts-item { font-size: 0.78rem; background: var(--surface); border: 1px solid var(--border); color: var(--ink2); padding: 0.28rem 0.75rem; border-radius: 3px }

/* OUTCOME METRIC */
.outcome-strip { border: 1px solid var(--border); border-radius: var(--rl); padding: 1.5rem; margin: 2rem 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; text-align: center }
.om-n { font-family: var(--serif); font-size: 2rem; color: var(--accent) }
.om-label { font-size: 0.78rem; color: var(--ink2); margin-top: 0.2rem }


@media (max-width: 900px) {
  .before-after, .outcome-strip { grid-template-columns: 1fr }
}

/* BOTTLENECK CALCULATOR */
.calc-wrap { background: var(--s2); border: 1px solid var(--border); border-radius: var(--r); padding: 1.6rem 1.8rem; margin: 2rem 0 }
.calc-label { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--ink3); font-weight: 600; margin-bottom: 1.2rem; font-family: var(--sans) }
.calc-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.4rem }
.calc-field { display: flex; flex-direction: column; gap: 0.35rem }
.calc-field span { font-size: 0.78rem; color: var(--ink2); font-family: var(--sans) }
.calc-field input { border: 1px solid var(--b2); border-radius: 5px; padding: 0.5rem 0.7rem; font-size: 1rem; font-family: var(--sans); color: var(--ink); background: #fff; width: 100% }
.calc-field input:focus { outline: none; border-color: var(--accent) }
.calc-outputs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-bottom: 1.4rem }
.calc-out { background: #fff; border: 1px solid var(--border); border-radius: 6px; padding: 1rem; text-align: center }
.calc-out-n { display: block; font-size: 1.5rem; font-weight: 600; color: var(--accent); font-family: var(--sans); margin-bottom: 0.3rem }
.calc-out-l { font-size: 0.72rem; color: var(--ink3); font-family: var(--sans) }
.calc-cta { display: inline-block; background: var(--accent); color: #fff; padding: 0.7rem 1.4rem; border-radius: var(--r); font-size: 0.85rem; font-family: var(--sans); text-decoration: none; font-weight: 500 }
.calc-cta:hover { background: var(--ah) }
@media (max-width: 640px) { .calc-inputs { grid-template-columns: 1fr } .calc-outputs { grid-template-columns: 1fr } }

/* TESTIMONIAL PULLQUOTE */
.pullquote { border-left: 3px solid var(--accent); padding: 1.1rem 1.5rem; margin: 2rem 0; background: var(--s2); border-radius: 0 4px 4px 0 }
.pullquote p { font-family: var(--serif); font-size: 1.15rem; font-style: italic; color: var(--fg); margin: 0 0 0.6rem; line-height: 1.6 }
.pullquote cite { font-size: 0.82rem; color: var(--ink3); font-style: normal; letter-spacing: 0.02em }