/* SEO landing pages (api/site_pages.py): extra layout on top of style.css */
.pg { max-width: 920px; margin: 0 auto; padding: 110px 20px 40px; }
.pg-hero h1 { font-size: clamp(36px, 5vw, 64px); }
.pg-sec { margin-top: 64px; }
.pg-sec h2 { font-size: clamp(28px, 3.4vw, 42px); line-height: 1.1; margin-bottom: 16px; }
.pg-sec h3 { font-size: 20px; margin: 20px 0 4px; }
.pg-sec p { margin-top: 12px; max-width: 42em; }
.pg-sec .small, .pg-sec .note { margin-top: 10px; }
.pg-films { display: flex; flex-wrap: wrap; gap: 40px 36px; margin-top: 26px; }
.pg-card { width: min(100%, 270px); cursor: default; }
.pg-card h3 { font-size: 22px; margin: 18px 0 4px; }
.pg-btns { display: grid; gap: 8px; margin-top: 12px; }
.pg-btns .btn { min-height: 44px; padding: 11px 18px; font-size: 14px; text-align: center; }
.pg-steps { list-style: none; padding: 0; margin: 20px 0 0; display: grid; gap: 14px; counter-reset: s; }
.pg-steps li { counter-increment: s; padding: 18px 20px 18px 64px; position: relative; background: #fbf8f2; border-radius: 4px; box-shadow: 0 14px 30px -18px rgba(60, 40, 20, .35); }
.pg-steps li::before { content: counter(s); position: absolute; left: 20px; top: 12px; font: 400 34px/1 var(--serif); color: var(--terra); }
.pg-steps h3 { margin: 0 0 2px; font-size: 20px; }
.pg-steps p { margin: 0; color: var(--soft); }
.pkgs { list-style: none; padding: 0; margin: 20px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.pkgs li { background: #fbf8f2; border-radius: 4px; padding: 24px 18px; text-align: center; box-shadow: 0 14px 30px -18px rgba(60, 40, 20, .35); }
.pkgs b { display: block; font: 400 20px/1.2 var(--serif); }
.pkgs .pr { display: block; margin-top: 8px; font: 400 34px/1 var(--serif); color: var(--terra); }
.pg-links a { color: var(--terra); }
@media (max-width: 860px) {
  .top { padding: 12px 16px; } .pill { margin-left: auto; font-size: 13px; padding: 8px 14px; }
  .pg { padding-top: 86px; }
  .pg-films { gap: 32px 16px; } .pg-card { width: calc(50% - 8px); } .pg-card h3 { font-size: 17px; }
  .pkgs { grid-template-columns: 1fr; }
}
@media (max-width: 440px) { .pg-card { width: 100%; max-width: 300px; margin: 0 auto; } }