/* Layout wrapper: the pages were designed at 1440px wide */
html { scroll-behavior: smooth; }
body { margin: 0; background: #ffffff; -webkit-font-smoothing: antialiased; }
.page { width: 100%; max-width: 1440px; margin: 0 auto; min-height: 100vh; }
img { max-width: 100%; }

/* Tablet */
@media (max-width: 1100px) {
  .page section, .page header, .page footer, .page nav { padding-left: 40px !important; padding-right: 40px !important; }
  .page h1 { font-size: 72px !important; width: auto !important; }
  .page h1 + * , .page p { max-width: 100% !important; }
}

/* Phone */
@media (max-width: 760px) {
  .page section, .page header, .page footer { padding: 56px 20px !important; height: auto !important; }
  .page nav { height: auto !important; padding: 16px 20px !important; flex-wrap: wrap; gap: 12px; }
  .page nav > div:last-child { gap: 16px !important; flex-wrap: wrap; font-size: 14px !important; }

  /* every 12-column grid becomes a single column */
  .page [style*="grid-template-columns"] { display: flex !important; flex-direction: column !important; gap: 24px !important; }
  .page [style*="grid-column"] { width: 100% !important; }

  /* hero art: stop absolute positioning so it stacks under the text */
  .page section [style*="position: absolute"] img,
  .page section img[style*="position: absolute"] { position: static !important; width: 100% !important; height: auto !important; max-height: 420px; object-fit: cover; margin-bottom: 16px; border-width: 0 !important; }
  .page div[style*="position: absolute"][style*="background: #3A6C98"],
  .page div[style*="position: absolute"][style*="background: #2E5A81"],
  .page div[style*="position: absolute"][style*="background: #FBEFC4"] { display: none !important; }

  .page h1 { font-size: 46px !important; line-height: 1.05 !important; width: auto !important; }
  .page h2 { font-size: 34px !important; }
  .page h3 { font-size: 30px !important; width: auto !important; }
  .page p, .page blockquote { font-size: 17px !important; }
  .page img[width] { width: 100% !important; height: auto !important; }
  .page [style*="width: 760px"] { width: 100% !important; padding: 0 20px; box-sizing: border-box; }
  .page article { padding: 40px 0 64px !important; }
  .page [style*="width: 150px"] { width: 72px !important; }
  .page [style*="justify-content: space-between"] { flex-wrap: wrap; gap: 16px; }
  .page [style*="min-height: 600px"] { min-height: 0 !important; }
}