/* smoother. Stage 1 — preserve the original layout, change the visual language. */
:root {
  --ink: #273827;
  --dark: #233525;
  --paper: #f7f8f0;
  --lime: #b7c783;
  --muted: #64715f;
  --line: #d7dfd1;
  --white: #ffffff;
}
body { background: var(--paper); color: var(--ink); }
header { background: rgba(247,248,240,.97); border-bottom-color: var(--line); }
.nav { min-height: 99px; }
.brand-logo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0;
  min-width: 160px;
  letter-spacing: normal;
}
.brand-logo img { display: block; width: 193px; height: auto; }
.brand-logo span {
  color: #54634d;
  font-family: var(--body);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .035em;
  line-height: 1.3;
  white-space: nowrap;
  margin-top: -1px;
}
.nav nav { gap: 23px; }
.nav nav a[aria-current] { box-shadow: 0 2px 0 var(--ink); }
.nav nav a:not(.button):hover { color: #596d40; }
.preview {
  background: #e9ede0;
  color: #526248;
  border-bottom: 1px solid #dae1d1;
  font-weight: 800;
}
h1,h2,h3,h4 { letter-spacing: -.048em; }
em { color: #829958; }
a:hover { color: #657d49; }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {
  outline-color: #8fa760;
}
.button { background: var(--lime); color: var(--ink); }
.button:hover { background: #c4d496; color: var(--ink); }
.button.small { background: var(--ink); color: #f8f9f2; }
.button.secondary { border-color: #afbea2; background: transparent; }
.button.secondary:hover { background: #e7ecdf; }
.button.outline { border-color: #8f9d86; color: #fff; }
.button.outline:hover { background: #384d34; }
button:disabled,button:disabled:hover {
  opacity: .6;
  cursor: not-allowed;
  transform: none;
  background: #dce4ce;
  border-color: #cdd8bd;
}
.eyebrow { color: #687d49; }
.hero { background: var(--dark); }
.hero em { color: #cad79d; }
.hero p { color: #d7e0d0; }
.hero-credit { color: #b8c8b0; }
.hero .eyebrow.light { color: #cad79d; }
.paper { background: #f7f7ed; box-shadow: 12px 15px 0 #3a4d35; }
.paper-line i { background: #e2ebc9; }
.art-caption,.art-label { color: #b2c6ae; }
.proof-strip { background: #e8eddf; }
.proof-strip span { color: #5d6b57; border-color: #d5dfcb; }
.tinted { background: #e8eee1; }
.case-card { border-color: #d7e0d2; box-shadow: 0 5px 25px rgba(35,53,37,.025); }
.case-card:hover { border-color: #acbd9b; }
.case-num { color: #adbd96; }
.section-lead { max-width: 825px; color: var(--muted); margin-bottom: 35px; font-size: 15px; }
.inline-proof-link { color: var(--ink); text-decoration: underline; font-weight: 700; text-underline-offset: 3px; white-space: nowrap; }
.steps>div { padding-bottom: 22px; margin-bottom: 23px; }
.steps span { color: #6f8650; }
.steps .button { margin-left: 49px; }
.resource-feature { background: #e5ebda; }
.resource-stack { background: #f8f9f1; border-color: #b8caa9; box-shadow: 9px 9px 0 #cddabb; }
.resource-stack>div { border-color: #d1dfc5; }
.follow-link { margin-top: 18px; font-size: 13px; font-weight: 700; }
.follow-link a { text-decoration: underline; text-underline-offset: 3px; }
.cta { background: var(--dark); }
.cta em { color: #cbd79f; }
.cta .eyebrow { color: #cbd79f; }
.cta p { color: #d2dfcc; }
.cta-inner:after { color: #43583b; }
footer { background: #19291c; color: #bfccba; }
.footer-brand { display: inline-block!important; }
.footer-brand img { display: block; width: 206px; max-width: 100%; }
.footer-grid .brand { margin-bottom: 12px; }
.footer-grid p { max-width: 350px; }
.footer-grid strong { color: #f1f4eb; }
.footer-bottom { border-color: #40523e; }
.article-body { color: #364733; }
.article-body h2 { color: var(--ink); }
.brief { background: #edf1e7; }
.article-offer { background: var(--ink); }
.article-offer .eyebrow { color: #cbd79f; }
.about-note { background: #e5edda; border-radius: 5px; }
.about-note blockquote { color: var(--ink); font-size: 26px; }
.giant-num { color: #93ac78; }
.resource-card { border-color: var(--line); }
.resource-card p { color: var(--muted); }
.notice { background: #ebf0e4; border-color: #9bae78; color: #475742; }
input,select,textarea { border-color: #c7d3c1; background: #fafbf6; color: var(--ink); }
.form-note { line-height: 1.6; }
.check-label { font-size: 12px; line-height: 1.5; }
.check-label input { flex: 0 0 16px; }
.search-label { color: var(--ink); }
.filters button[aria-pressed=true] { background: var(--ink); border-color: var(--ink); }
.service-row p { line-height: 1.75; }
.service-row ul { padding-left: 19px; }
.service-row li { line-height: 1.6; }
.trap-field { position: absolute; height: 1px; width: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* Article questions: simple, readable, and deliberately below the full case study. */
.article-faq { margin: 66px 0 54px; padding-top: 35px; border-top: 1px solid #cddbc5; }
.article-faq h2 { font-size: clamp(30px,3vw,40px); line-height: 1.18; margin-bottom: 12px; }
.article-faq h2 em { color: #839b68; }
.article-faq .eyebrow { margin-bottom: 15px; }
.faq-intro { max-width: 650px; font-size: 14px; color: #687664; margin-bottom: 27px; }
.faq-list { border-top: 1px solid #cbd9c3; }
.faq-item { border-bottom: 1px solid #cbd9c3; background: transparent; }
.faq-item summary { list-style: none; display: flex; justify-content: space-between; align-items: flex-start; gap: 22px; cursor: pointer; padding: 20px 1px; font-size: 17px; font-weight: 650; line-height: 1.48; color: #243b29; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::marker { content: ""; }
.faq-item summary:hover { color: #617947; }
.faq-item summary:focus-visible { outline: 3px solid #8fa760; outline-offset: 4px; }
.faq-expand { flex: 0 0 26px; display: grid; place-items: center; height: 26px; border-radius: 50%; background: #e2eaca; color: #3d5633; font-size: 20px; font-weight: 400; line-height: 1; transition: transform .15s; }
.faq-item[open] .faq-expand { transform: rotate(45deg); }
.faq-answer { padding: 0 30px 24px 2px; font-size: 15px; line-height: 1.78; }
.article-body .faq-answer p { margin: 0 0 12px; color: #4b6049; }
.faq-answer a { color: #405f37; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.faq-answer a:hover { color: #6c8c53; }

@media (max-width: 1000px) {
  .nav nav { gap: 13px; }
  .brand-logo img { width: 150px; }
  .brand-logo span { font-size: 8px; }
}
@media (max-width: 760px) {
  .nav { min-height: 78px; }
  .brand-logo { min-width: 0; }
  .brand-logo img { width: 145px; }
  .brand-logo span { font-size: 8px; }
  .nav nav { top: 78px; }
  .nav nav a:not(.button) { display: block; }
  .hero h1 { font-size: clamp(39px,9.4vw,64px); }
  .hero-grid { gap: 36px; }
  .steps .button { margin-left: 0; }
  .section-lead { font-size: 14px; }
  .resource-stack { transform: rotate(-1deg); }
  .footer-brand img { width: 162px; }
  .about-note blockquote { font-size: 25px; }
  .service-row h2 { font-size: 25px; }
  .article-faq { margin: 50px 0 38px; padding-top: 28px; }
  .article-faq h2 { font-size: 29px; }
  .faq-item summary { font-size: 15px; padding: 17px 0; }
  .faq-answer { font-size: 14px; padding: 0 8px 20px 0; }
}