/* Hyva preview homepage: header, sections and footer share a 980px layout width. */
body.cms-index-index #header > .container,
body.cms-index-index .page-footer .container {
  width: 100%;
  max-width: 980px;
  margin-inline: auto;
  box-sizing: border-box;
}
body.cms-index-index .page-footer .container {
  padding-inline: 24px;
}
body.cms-index-index main.page-main .column.main > section {
  width: 100%;
  max-width: 980px !important;
  box-sizing: border-box;
  margin-inline: auto !important;
}
body.cms-index-index main.page-main .column.main > section:first-child > div {
  width: 100%;
  max-width: none !important;
  box-sizing: border-box;
  padding-left: 24px !important;
  padding-right: 24px !important;
}
body.cms-index-index main.page-main .column.main > section:nth-child(2) {
  padding-left: 24px !important;
  padding-right: 24px !important;
}
@media (max-width: 640px) {
  body.cms-index-index .page-footer .container {padding-inline: 16px;}
  body.cms-index-index main.page-main .column.main > section:first-child > div {padding-left: 16px !important; padding-right: 16px !important;}
  body.cms-index-index main.page-main .column.main > section:nth-child(2) {padding-left: 16px !important; padding-right: 16px !important;}
}

/* v2: the home content wrapper (max-width 1080 + 20px padding => ~1040px) is trimmed to exactly 980px,
   so banners/sections line up edge-to-edge with the 980px header nav bar. */
body.cms-index-index main.page-main .column.main > div:not([class]) {
  width: 100%;
  max-width: 980px !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  padding-top: 16px !important;
  box-sizing: border-box;
}
@media (max-width: 1020px) {
  body.cms-index-index main.page-main .column.main > div:not([class]) { padding-inline: 16px !important; }
}

/* v3: tighter vertical rhythm on the preview home page. */
body.cms-index-index main.page-main { margin-top: 0 !important; margin-bottom: 0 !important; }
body.cms-index-index main.page-main .column.main > div:not([class]) {
  padding-top: 14px !important;
  padding-bottom: 28px !important;
}
body.cms-index-index .ppt-hh-showcase { margin-bottom: 14px !important; }
body.cms-index-index .ppt-hh-lead { margin-bottom: 14px !important; padding-top: 18px !important; padding-bottom: 18px !important; }
body.cms-index-index .ppt-hh-featured-heading { margin-bottom: 12px !important; }
