/* Shared public-page treatment. Canvas diagrams retain their semantic colours. */
.marketing-page { background: var(--lp-paper); }
.marketing-page main { padding-top: 64px; padding-bottom: 80px; }
.marketing-page main>h1,.marketing-page main>div>h1,.marketing-method h1 {
  font-family: Inter,ui-sans-serif,system-ui,sans-serif;
  font-size: clamp(38px,4.5vw,64px);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: 1.08;
  color: var(--lp-ink);
  text-wrap: balance;
}
.marketing-page .text-ink { color: var(--lp-ink); }
.marketing-page .text-muted { color: var(--lp-muted); }
.marketing-page .text-faint { color: #697760; }
.marketing-page .text-accent { color: #426442; }
.marketing-page .border-line { border-color: var(--lp-line); }
.marketing-page .divide-line>:not(:last-child) { border-color: var(--lp-line); }
.marketing-page .bg-panel { background-color: var(--lp-paper); }
.marketing-page .bg-tint { background-color: #eaf0dc; }
.marketing-page .bg-accent { background-color: #233b32; }
.marketing-page a { text-underline-offset: 4px; }
.marketing-page a.text-accent:hover { color: #192c29; }
.marketing-page main>p.text-lg,.marketing-page main>div>p.text-lg { font-size: 17px; line-height: 1.85; max-width: 720px; }
.marketing-page h2 { line-height: 1.2; }
.marketing-page h3 { line-height: 1.4; letter-spacing: -.02em; }
.marketing-page .rounded-2xl,.marketing-page .rounded-3xl { border-radius: 12px; }
.marketing-page .bg-accent.text-center { margin-top: 64px; padding: 48px 32px; background: #233b32; }
.marketing-page .bg-accent.text-center h2 { color: #d4f588; font-size: clamp(28px,3vw,40px); font-weight: 400; }
.marketing-page .bg-accent.text-center p { color: #c0cfc2; }
.marketing-page .bg-accent.text-center>a { background: #d4f588; color: #233b32; box-shadow: none; border-radius: 8px; font-size: 13px; }
.marketing-page .bg-accent.text-center>a:hover { background: #e1ffa3; }
.marketing-page .price-pop { border-color: #d1daca; border-radius: 11px; box-shadow: none; transition: transform .18s; }
.marketing-page .price-pop:hover { transform: translateY(-3px); }
.marketing-page .price-pop:nth-child(2) { border-color: #334d3b; box-shadow: 0 12px 25px -22px #253628; }
.marketing-page .price-pop:nth-child(2)>span { background: #263d30; color: #d4f588; }
.marketing-page .price-pop:nth-child(2)>a { background: #263d30; color: white; box-shadow: none; }
.marketing-pricing section>div>div { border-bottom: 1px solid var(--lp-line); padding-bottom: 25px; }
.marketing-pricing section>h2 { font-size: 36px; }
.marketing-category-nav { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 32px; }
.marketing-category-nav a { border: 1px solid #cbd6c4; border-radius: 7px; padding: 9px 15px; font-size: 11px; color: #3e5739; background: #fff; }
.marketing-category-nav a:hover { background: #eaf0dc; border-color: #6c8756; }
.marketing-template-index section>h2,.marketing-guide-index section>h2 { border-top: 1px solid var(--lp-line); padding-top: 24px; color: #5b7052; }
.marketing-template-index section a.group { border-radius: 11px; padding: 25px; transition: box-shadow .18s,border-color .18s; }
.marketing-template-index section a.group:hover { border-color: #879e72; box-shadow: 0 12px 30px -20px #233b3255; }
.marketing-template-index section a.group:hover h3 { color: #36512e; }
.marketing-template-index section a.group h3 { font-size: 18px; font-weight: 500; }
.marketing-template-index section a.group p[aria-label] { flex-wrap: wrap; row-gap: 8px; }
.marketing-guide-index main { max-width: 1060px; }
.marketing-guide-index section ul { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; border: 0; }
.marketing-guide-index section li { background: #fff; border: 1px solid var(--lp-line); border-radius: 11px; padding: 25px; }
.marketing-guide-index section li h3 { font-family: Inter,ui-sans-serif,system-ui,sans-serif; font-size: 20px; }
.marketing-guide-index section li p { font-size: 13px; line-height: 1.8; margin-top: 12px; }
.marketing-guide-index section li:hover { border-color: #879e72; }
.marketing-guide-index section li a:hover { color: #36512e; }
.marketing-guide-index section li span { margin-top: 18px; }
.marketing-template-cta { background: #eaf0dc; border-color: #cbd8bb; }
.marketing-template-cta a { border-radius: 8px; box-shadow: none; white-space: normal; height: auto; min-height: 44px; padding-block: 10px; }
.marketing-guide-detail main { max-width: 860px; }
.marketing-page nav[aria-label=Breadcrumb] { display: flex; flex-wrap: wrap; gap: 10px; font-size: 11px; }
.marketing-page .prose { color: var(--lp-muted); font-size: 17px; line-height: 1.85; }
.marketing-page .prose h2 { color: var(--lp-ink); font-size: 32px; font-weight: 400; margin-top: 1.8em; }
.marketing-page .prose h3 { color: var(--lp-ink); font-size: 24px; font-weight: 500; }
.marketing-page .prose a { color: #426442; }
.marketing-page .prose strong { color: var(--lp-ink); }
.marketing-page .prose blockquote { border-color: #99b16f; background: #eaf0dc; padding: 12px 24px; border-radius: 0 8px 8px 0; }
.marketing-page .prose table { display: block; overflow-x: auto; font-size: 13px; }
.marketing-method main { padding-top: 0; }
.marketing-method .dotgrid { background: #f8f9f3; }
.marketing-method .bg-gradient-to-b { background-image: none; }
.marketing-method main>section.bg-white { background: #f0f3e9; }
.marketing-method h1+p { font-size: 17px; line-height: 1.85; }
.marketing-method main>div:first-child section { padding-top: 64px; }
.marketing-site>footer { position: relative; background: #172b24; }
.marketing-site>footer p { color: #b0bfad; }
@media(max-width:640px) {
  .marketing-page main { padding: 38px 20px 50px; }
  .marketing-page main>h1,.marketing-page main>div>h1,.marketing-method h1 { font-size: 39px; }
  .marketing-page main>p.text-lg,.marketing-page main>div>p.text-lg { font-size: 15px; }
  .marketing-page .bg-accent.text-center { padding: 32px 22px; }
  .marketing-page .bg-accent.text-center>a { height: auto; min-height: 48px; padding-block: 12px; }
  .marketing-guide-index section ul { grid-template-columns: 1fr; }
  .marketing-page .prose { font-size: 16px; }
  .marketing-page .prose h2 { font-size: 28px; }
  .marketing-template-cta { padding: 20px; }
  .marketing-template-cta>p { flex-basis: 100%; }
  .marketing-template-cta>a { width: 100%; justify-content: center; text-align: center; }
  .marketing-method main { padding: 0 0 45px; }
  .marketing-method main>div:first-child section { padding-top: 38px; }
  .marketing-category-nav { gap: 8px; }
  .marketing-category-nav a { padding: 10px 12px; }
}
@media(prefers-reduced-motion:reduce) { .marketing-page .price-pop:hover { transform: none; } }
.marketing-pricing main>div>h1 { text-wrap: initial; }