
/* ===== DWELLPAC ARTICLE - BLACK / WHITE / GREEN DESIGN SYSTEM ===== */
:root {
  --dp-green: #1B6B3A;
  --dp-green-dark: #134D2A;
  --dp-green-light: #E8F2EC;
  --dp-green-muted: #D0E4D7;
  --dp-black: #1A1A1A;
  --dp-gray-900: #2D2D2D;
  --dp-gray-700: #555;
  --dp-gray-500: #888;
  --dp-gray-300: #D4D4D4;
  --dp-gray-100: #F5F5F5;
  --dp-white: #FFFFFF;
  --dp-radius: 6px;
  --dp-shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
}
.dwellpac-article {
  max-width: 860px; margin: 0 auto;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  color: var(--dp-black); line-height: 1.78; font-size: 16.5px;
  -webkit-font-smoothing: antialiased;
}
.dwellpac-article h2 {
  font-size: 28px; font-weight: 800; color: var(--dp-black);
  margin: 0 0 10px; padding-bottom: 14px;
  border-bottom: 3px solid var(--dp-green); line-height: 1.3;
}
.dwellpac-article .article-subtitle {
  font-size: 17px; color: var(--dp-gray-700); margin: 0 0 28px; line-height: 1.6;
}
.dwellpac-article .article-meta {
  display: flex; align-items: center; gap: 16px;
  font-size: 13.5px; color: var(--dp-gray-500);
  margin-bottom: 32px; padding-bottom: 20px;
  border-bottom: 1px solid var(--dp-gray-300); flex-wrap: wrap;
}
.dwellpac-article h3 {
  font-size: 20px; font-weight: 700; color: var(--dp-black);
  margin: 40px 0 12px; padding-left: 14px;
  border-left: 4px solid var(--dp-green); line-height: 1.35;
}
.dwellpac-article h4 {
  font-size: 17px; font-weight: 700; color: var(--dp-gray-900); margin: 28px 0 8px;
}
.dwellpac-article p { margin: 0 0 16px; }
.dwellpac-article ul, .dwellpac-article ol { margin: 0 0 20px; padding-left: 24px; }
.dwellpac-article li { margin-bottom: 8px; }
.dwellpac-article a {
  color: var(--dp-green); font-weight: 600; text-decoration: none;
  border-bottom: 1px solid transparent; transition: border-color 0.2s;
}
.dwellpac-article a:hover { border-bottom-color: var(--dp-green); }
.dwellpac-article hr { border: none; border-top: 1px solid var(--dp-gray-300); margin: 36px 0; }
.dwellpac-article .toc {
  background: var(--dp-gray-100); border: 1px solid var(--dp-gray-300);
  border-radius: var(--dp-radius); padding: 20px 24px; margin-bottom: 36px;
}
.dwellpac-article .toc h4 {
  font-size: 13px; font-weight: 700; text-transform: uppercase;
  color: var(--dp-gray-500); margin: 0 0 12px; padding: 0; border: none;
}
.dwellpac-article .toc ul { margin: 0; padding: 0; list-style: none; columns: 2; column-gap: 24px; }
.dwellpac-article .toc li { margin-bottom: 6px; break-inside: avoid; }
.dwellpac-article .toc a { font-weight: 500; font-size: 14.5px; color: var(--dp-gray-700); border-bottom: none; }
.dwellpac-article .toc a:hover { color: var(--dp-green); }
.dwellpac-article blockquote {
  background: var(--dp-green-light); border-left: 4px solid var(--dp-green);
  margin: 24px 0; padding: 16px 20px; border-radius: 0 var(--dp-radius) var(--dp-radius) 0;
}
.dwellpac-article blockquote p { margin: 0; color: var(--dp-green-dark); }
.dwellpac-article .stat-row { display: flex; gap: 16px; margin: 24px 0; flex-wrap: wrap; }
.dwellpac-article .stat-card {
  flex: 1; min-width: 160px; background: var(--dp-white);
  border: 1px solid var(--dp-gray-300); border-top: 3px solid var(--dp-green);
  border-radius: var(--dp-radius); padding: 16px 18px; text-align: center;
}
.dwellpac-article .stat-card .stat-value {
  font-size: 24px; font-weight: 800; color: var(--dp-green); line-height: 1.2; margin-bottom: 4px;
}
.dwellpac-article .stat-card .stat-label { font-size: 13px; color: var(--dp-gray-500); line-height: 1.4; }
.dwellpac-article .table-wrap { overflow-x: auto; margin: 12px 0 24px; }
.dwellpac-article table {
  width: 100%; min-width: 760px; border-collapse: collapse; margin: 0; font-size: 15px;
  box-shadow: var(--dp-shadow-sm); border-radius: var(--dp-radius); overflow: hidden;
}
.dwellpac-article table caption {
  text-align: left; font-weight: 600; font-size: 14px;
  color: var(--dp-gray-700); margin-bottom: 8px; padding-left: 2px;
}
.dwellpac-article thead th {
  background: var(--dp-black); color: var(--dp-white);
  padding: 12px 16px; text-align: left; font-weight: 600; font-size: 14px;
}
.dwellpac-article tbody td {
  padding: 11px 16px; border-bottom: 1px solid var(--dp-gray-300); vertical-align: top;
}
.dwellpac-article tbody tr:nth-child(even) { background: var(--dp-gray-100); }
.dwellpac-article tbody tr:hover { background: var(--dp-green-light); transition: background 0.15s; }
.dwellpac-article tbody tr:last-child td { border-bottom: none; }
.dwellpac-article .note-box {
  background: var(--dp-gray-100); border: 1px solid var(--dp-gray-300);
  border-radius: var(--dp-radius); padding: 18px 22px; margin: 20px 0 24px;
}
.dwellpac-article .note-box p:last-child { margin-bottom: 0; }
.dwellpac-article .faq-item {
  margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--dp-gray-300);
}
.dwellpac-article .faq-item:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.dwellpac-article .faq-q { font-weight: 700; color: var(--dp-black); margin-bottom: 6px; font-size: 16.5px; }
.dwellpac-article .faq-a { color: var(--dp-gray-700); margin: 0; }
.dwellpac-article .cta-section {
  background: var(--dp-black); color: var(--dp-white);
  border-radius: var(--dp-radius); padding: 32px 36px; margin: 40px 0 32px;
}
.dwellpac-article .cta-section h3 { color: var(--dp-white); border-left-color: var(--dp-green); margin-top: 0; font-size: 22px; }
.dwellpac-article .cta-section p { color: #ccc; margin-bottom: 16px; }
.dwellpac-article .cta-section a.cta-btn {
  display: inline-block; background: var(--dp-green); color: var(--dp-white);
  font-weight: 700; padding: 12px 28px; border-radius: var(--dp-radius);
  text-decoration: none; border-bottom: none; font-size: 15px;
  transition: background 0.2s; margin-right: 12px; margin-bottom: 8px;
}
.dwellpac-article .cta-section a.cta-btn:hover { background: var(--dp-green-dark); }
.dwellpac-article .cta-section a.cta-link { color: var(--dp-green-muted); font-weight: 500; border-bottom: 1px dotted var(--dp-green-muted); }
.dwellpac-article .cta-section a.cta-link:hover { color: var(--dp-white); border-bottom-color: var(--dp-white); }
.dwellpac-article .related-reading {
  background: var(--dp-gray-100); border-radius: var(--dp-radius); padding: 24px 28px; margin-bottom: 24px;
}
.dwellpac-article .related-reading h4 { font-size: 13px; text-transform: uppercase; color: var(--dp-gray-500); margin: 0 0 12px; padding: 0; border: none; }
.dwellpac-article .related-reading ul { margin: 0; padding: 0; list-style: none; }
.dwellpac-article .related-reading li { margin-bottom: 8px; padding-left: 16px; position: relative; }
.dwellpac-article .related-reading li::before { content: "\2192"; position: absolute; left: 0; color: var(--dp-green); font-weight: 700; }
.dwellpac-article .references { font-size: 13.5px; color: var(--dp-gray-500); line-height: 1.65; }
@media (max-width: 640px) {
  .dwellpac-article { font-size: 15px; padding: 0 4px; }
  .dwellpac-article h2 { font-size: 22px; }
  .dwellpac-article h3 { font-size: 18px; }
  .dwellpac-article .toc ul { columns: 1; }
  .dwellpac-article .stat-row { flex-direction: column; }
  .dwellpac-article table { font-size: 13.5px; }
  .dwellpac-article thead th, .dwellpac-article tbody td { padding: 8px 10px; }
  .dwellpac-article .cta-section { padding: 24px 20px; }
}
