/* Readability and proportional rhythm for long-form guide content. */
.utility-bar { display: none; }

.site-header {
  min-height: 112px;
  gap: 30px;
  padding: 16px clamp(30px, 4.5vw, 88px);
}

.site-header nav {
  gap: 27px;
  margin-left: 0;
}

.site-header nav a {
  font-size: 16px;
  white-space: nowrap;
}

.header-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(170px, 1fr));
  gap: 12px;
  margin-left: auto;
}

.header-button {
  display: grid;
  min-height: 64px;
  place-items: center;
  padding: 0 26px;
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none;
  text-transform: uppercase;
}

.header-register { background: #262526; }
.header-download { background: #cf3154; }
.header-register:hover { background: #383638; }
.header-download:hover { background: #e33a60; }
.header-cta { display: none; }

@media (max-width: 1280px) {
  .site-header { gap: 22px; }
  .site-header nav { gap: 18px; }
  .site-header nav a { font-size: 14px; }
  .header-actions { grid-template-columns: repeat(2, minmax(138px, 1fr)); }
  .header-button { padding: 0 18px; }
}

.hero { min-height: 620px; }
.hero h1 { font-size: clamp(58px, 5.4vw, 92px); }
.hero-card { width: 365px; padding: 36px 32px; }

.copy-section > h2,
.dark-copy > h2,
.payments-section h2,
.keyword-guide h2,
.app-table-section h2 { margin-bottom: 23px; }

.copy-section > p:not(.eyebrow),
.dark-copy > p:not(.eyebrow),
.payments-section > div > p:not(.eyebrow) { max-width: 980px; }

.copy-section > p:not(.eyebrow) { font-size: 18px; line-height: 1.78; }
.dark-copy > p:not(.eyebrow) { max-width: 1030px; line-height: 1.78; }
.payments-section > div > p:not(.eyebrow) { max-width: 920px; line-height: 1.78; }

.copy-section > p:not(.eyebrow) + p:not(.eyebrow),
.dark-copy > p:not(.eyebrow) + p:not(.eyebrow),
.payments-section > div > p:not(.eyebrow) + p:not(.eyebrow) { margin-top: 18px; }

.three-columns,
.four-columns { margin-top: 48px; }

.three-columns article,
.four-columns article { min-height: 205px; }

.table-wrap { border: 1px solid rgba(255,255,255,.12); box-shadow: 0 14px 35px rgba(0,0,0,.13); }
.payments-section .table-wrap { border-color: #c2c7ce; box-shadow: 0 14px 30px rgba(29,38,48,.08); }

.keyword-columns article { min-height: 330px; }
.keyword-columns p { font-size: 15px; }

.bonus-section { align-items: stretch; }
.bonus-copy { display: flex; flex-direction: column; justify-content: center; }
.bonus-copy .button { margin-top: 12px; }

@media (max-width: 900px) {
  .site-header { min-height: 78px; }
  .header-actions { grid-template-columns: 1fr; margin-left: auto; }
  .header-register { display: none; }
  .header-button { min-height: 48px; padding: 0 18px; font-size: 13px; }
  .keyword-columns article { min-height: auto; }
  .three-columns article,
  .four-columns article { min-height: auto; }
}

@media (max-width: 560px) {
  .header-actions { display: none; }
  .site-header { padding: 14px 24px; }
  .copy-section > p:not(.eyebrow),
  .dark-copy > p:not(.eyebrow),
  .payments-section > div > p:not(.eyebrow) { font-size: 16px; line-height: 1.72; }
}
