.editorial-page { background: #f4f2e8; }
.editorial-header { position: relative; }
.editorial-nav { display: flex; gap: .25rem; flex-wrap: wrap; justify-content: flex-end; }
.editorial-nav a { padding: .6rem .7rem; font-weight: 800; text-decoration: none; }
.editorial-page .breadcrumbs { padding-top: 2rem; margin-bottom: 0; }
.article-hero { display: grid; gap: 1.5rem; padding-top: 3rem; padding-bottom: 4rem; }
.article-hero h1 { font-size: clamp(2.7rem, 7vw, 5.8rem); }
.article-meta { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.4rem; }
.article-meta span { padding: .4rem .65rem; border: 1px solid var(--border); border-radius: 999px; background: #ffffff90; font-size: .8rem; font-weight: 750; }
.hero-note { align-self: end; padding: 1.3rem; border-radius: var(--radius); background: var(--brand); color: white; box-shadow: var(--shadow); }
.hero-note strong { color: var(--lime); font-size: 1.05rem; }
.article-layout { display: grid; gap: 2rem; align-items: start; }
.toc { display: grid; gap: .25rem; padding: 1rem; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); }
.toc strong { padding: .45rem .6rem; }
.toc a { padding: .45rem .6rem; border-radius: 8px; text-decoration: none; color: var(--muted); }
.toc a:hover { background: var(--soft); color: var(--ink); }
.article-main > section { padding: 1rem 0 4rem; scroll-margin-top: 2rem; }
.article-main h2 { max-width: 760px; }
.criteria-grid, .placement-grid, .related-grid { display: grid; gap: 1rem; }
.criteria-grid article, .placement-grid article, .related-grid article { padding: 1.2rem; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); }
.criteria-grid article > span, .plant-number { color: var(--brand-2); font: 900 1.4rem/1 Georgia, serif; }
.plant-list { display: grid; gap: 1.25rem; margin-top: 2rem; }
.plant-card { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 1rem; padding: clamp(1.1rem,3vw,2rem); border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); scroll-margin-top: 1rem; }
.plant-card h3 { margin: .2rem 0 1rem; font-size: clamp(1.65rem,4vw,2.3rem); }
.plant-card h3 i { display: block; margin-top: .35rem; color: var(--muted); font: 400 1rem/1.4 Georgia, serif; letter-spacing: 0; }
.plant-use { margin: 0; color: var(--brand-2); font-size: .78rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.plant-card dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .6rem 1rem; }
.plant-card dl div { padding-top: .65rem; border-top: 1px solid var(--border); }
.plant-card dt { font-weight: 900; }
.plant-card dd { margin: .2rem 0 0; color: var(--muted); }
.pet { padding: .75rem; border-radius: 10px; }
.pet.safe, .status.safe { background: #e2f2e4; color: #164b29; }
.pet.caution, .status.caution { background: #fff0dc; color: #703d00; }
.sources { display: flex; gap: .8rem; flex-wrap: wrap; }
.sources a { font-size: .85rem; font-weight: 800; }
.data-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); }
.data-table-wrap table { width: 100%; min-width: 720px; border-collapse: collapse; }
.data-table-wrap th, .data-table-wrap td { padding: .85rem; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.data-table-wrap th { background: var(--soft); }
.status { display: inline-block; padding: .25rem .5rem; border-radius: 999px; font-size: .76rem; font-weight: 900; }
.data-note, .method-note { padding: 1rem; border-left: 4px solid var(--brand-2); background: var(--soft); }
.placement-grid article > span { font-size: 2rem; color: var(--brand-2); }
.pet-section { padding: 1.5rem !important; border-radius: var(--radius); background: var(--brand); color: white; }
.pet-section p { color: #e5eee8; }
.faq details { margin: .7rem 0; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.faq summary { padding: 1rem; cursor: pointer; font-weight: 900; }
.faq details p { padding: 0 1rem 1rem; color: var(--muted); }
.related-grid a { font-weight: 900; }
.method-note { margin-bottom: 5rem; }
@media (max-width: 720px) {
  .editorial-header { align-items: flex-start; }
  .editorial-nav { display: none; }
  .plant-card { grid-template-columns: 1fr; }
  .plant-card dl { grid-template-columns: 1fr; }
}
@media (min-width: 760px) {
  .article-hero { grid-template-columns: minmax(0,2fr) minmax(240px,.75fr); }
  .criteria-grid, .placement-grid, .related-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (min-width: 980px) {
  .article-layout { grid-template-columns: 210px minmax(0,1fr); }
  .toc { position: sticky; top: 1rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
