.ct {
  display: grid;
  grid-template-areas:
    "header"
    "main"
    "footer";
  grid-template-rows: auto 1fr auto;
  grid-template-columns: 100%;
  min-height: 100vh;
}
.ct > header { grid-area: header; }
.ct > main { grid-area: main; }
.ct > footer { grid-area: footer; }

.rt { min-height: 100%; }
.wr { overflow-x: clip; }
.sw { width: 100%; }
.sc { width: var(--fl-wrap); max-width: 1200px; margin: 0 auto; }

main > section:nth-child(odd) .zz-tx { order: 1; }
main > section:nth-child(odd) .zz-ar { order: 2; }
main > section:nth-child(even) .zz-tx { order: 2; }
main > section:nth-child(even) .zz-ar { order: 1; }

.deco { display: block; }
.sec2 { display: block; }

@media (max-width: 767px) {
  .deco { display: none; }
  .sec2 { display: none; }
  .rero h1 { font-size: 2rem; }
  .sec { padding: 1.5rem 0 3.25rem; }
  .hdr .bt-s { display: none; }
  .hdr-tg { margin-left: auto; }
}

@media (min-width: 400px) {
  .hdr-lg svg { height: 1.3rem; }
}

@media (min-width: 640px) {
  .cali-g { grid-template-columns: repeat(2, 1fr); }
  .lete-g { grid-template-columns: repeat(2, 1fr); }
  .ftr-c { grid-template-columns: repeat(2, 1fr); }
  .inde-fm { padding: 2rem 1.75rem; }
}

@media (min-width: 768px) {
  :root { --hdr-h: 4.5rem; }
  .hdr-lg svg { height: 1.45rem; }
  .hdr-nv { margin-left: auto; }
  .hdr-nv .hdr-a { padding: 0.5rem 0.55rem; font-size: 0.88rem; border-bottom: 0; }
  .hdr .bt-s { display: none; }
  .sec { padding: 3rem 0 4.25rem; }
  .zz { grid-template-columns: repeat(2, 1fr); }
  .zz-ar { width: 88%; }
}

@media (min-width: 1024px) {
  .hdr-lg svg { height: 1.6rem; }
  .hdr-nv .hdr-a { padding: 0.5rem 0.8rem; font-size: 0.95rem; }
  .hdr .bt-s { display: inline-flex; margin-left: 0.75rem; }
  .rero { padding: calc(var(--hdr-h) + 3rem) 0 4rem; min-height: 70vh; }
  .rero-pn { inset: 0 32% 0 0; clip-path: polygon(0 0, 100% 0, 80% 100%, 0 100%); }
  .rero-g {
    grid-template-columns: 52% 1fr;
    grid-template-areas:
      "ey fg"
      "h fg"
      "ld fg"
      "pr fg"
      "ct fg"
      "bd fg";
    column-gap: 4%;
    row-gap: 0.9rem;
    align-items: start;
  }
  .rero-fg { align-self: center; max-width: none; }
  .cali-g { grid-template-columns: repeat(4, 1fr); }
  .inde-g { grid-template-columns: 44% 1fr; column-gap: 6%; }
  .ftr-c { grid-template-columns: 34% 1fr 1fr 1fr; gap: 2.5rem; }
}