.responsibilities { padding: 130px 0 20px; }

.responsibility-grid,
.channel-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.responsibility-grid article,
.channel-grid article {
  padding: 30px;
  border: 1px solid var(--line);
  background: var(--white);
}

.responsibility-grid article > span,
.channel-grid article > span {
  color: #8b9088;
  font-size: 8px;
  letter-spacing: .18em;
}

.responsibility-grid h3,
.channel-grid h3 {
  margin: 24px 0 18px;
  font: 25px Georgia, serif;
}

.responsibility-grid ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.responsibility-grid li {
  padding: 10px 0;
  border-top: 1px solid var(--line);
  color: #71766e;
  font-size: 11px;
}

.workspace-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.workspace-actions .button { min-height: 42px; }

.channel-section {
  padding: 125px 0;
  background: #e2e5db;
}

.channel-grid { grid-template-columns: repeat(4, 1fr); }
.channel-grid article { background: rgba(252,251,247,.72); }
.channel-grid p { margin: 0; color: #71766e; font-size: 11px; line-height: 1.7; }

.faq { padding: 130px 0; }
.faq-list { border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { position: relative; padding: 25px 46px 25px 0; cursor: pointer; list-style: none; font: 21px Georgia, serif; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 5px; top: 22px; color: #7c8279; font: 22px Arial, sans-serif; }
.faq details[open] summary::after { content: "−"; }
.faq details p { max-width: 720px; margin: -5px 0 25px; color: #747970; font-size: 12px; line-height: 1.75; }

.join { text-align: left; }
.join-inner { max-width: 1200px; margin: auto; display: grid; grid-template-columns: .85fr 1.15fr; gap: 90px; align-items: start; }
.join-inner > div > p:not(.kicker) { max-width: 410px; margin: 25px 0 0; color: #6f756d; font-size: 13px; line-height: 1.7; }
#retailer-form { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
#retailer-form label { display: flex; flex-direction: column; gap: 8px; color: #60665e; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
#retailer-form label.full { grid-column: 1 / -1; }
#retailer-form input,
#retailer-form select,
#retailer-form textarea { width: 100%; padding: 13px 0; border: 0; border-bottom: 1px solid #aeb5aa; outline: 0; border-radius: 0; background: transparent; color: var(--ink); font: 13px Arial, sans-serif; text-transform: none; }
#retailer-form textarea { padding: 13px; border: 1px solid #aeb5aa; resize: vertical; }
#retailer-form input:focus,
#retailer-form select:focus,
#retailer-form textarea:focus { border-color: var(--dark); }
#retailer-form .button { justify-self: start; }
.form-note { align-self: center; margin: 0; color: #737970; font-size: 9px; line-height: 1.5; }
.consent { flex-direction: row !important; align-items: flex-start; gap: 11px !important; padding: 8px 0; font-size: 10px !important; font-weight: 400 !important; line-height: 1.6; letter-spacing: 0 !important; text-transform: none !important; }
.consent input { width: 17px !important; min-width: 17px; height: 17px; margin: 1px 0 0; accent-color: var(--dark); }
.consent a { border-bottom: 1px solid #8e958b; }

.legal-page { max-width: 820px; margin: 0 auto; padding: 90px 40px 130px; }
.legal-page h1 { margin: 0 0 24px; font: 54px/.98 Georgia, serif; letter-spacing: -.035em; }
.legal-page .legal-lead { margin-bottom: 50px; color: #686e66; font-size: 15px; line-height: 1.75; }
.legal-page article { padding: 25px 0; border-top: 1px solid var(--line); }
.legal-page h2 { margin: 0 0 13px; font: 24px Georgia, serif; }
.legal-page p,.legal-page li { color: #6b7169; font-size: 12px; line-height: 1.8; }
.legal-page ul { padding-left: 20px; }
.legal-back { display: inline-block; margin-bottom: 50px; border-bottom: 1px solid #8e958b; font-size: 11px; }

.site-footer { max-width: 1280px; padding-inline: 40px; }
.footer-links { display: flex; justify-content: flex-end; gap: 17px; flex-wrap: wrap; }

@media (max-width: 960px) {
  .responsibilities,.faq { margin-inline: 24px; }
  .channel-section { padding-inline: 24px; }
  .responsibility-grid { grid-template-columns: 1fr; }
  .channel-grid { grid-template-columns: 1fr 1fr; }
  .join-inner { grid-template-columns: 1fr; gap: 50px; }
  .join { padding-inline: 24px; }
  .site-footer { padding-inline: 0; }
  .footer-links { justify-content: flex-start; }
}

@media (max-width: 600px) {
  .responsibilities,.faq { padding-block: 85px; margin-inline: 18px; }
  .channel-section { padding: 85px 18px; }
  .channel-section .section { margin: 0; }
  .channel-grid { grid-template-columns: 1fr; }
  .workspace-actions { justify-content: flex-start; }
  #retailer-form { grid-template-columns: 1fr; }
  #retailer-form label.full { grid-column: auto; }
  #retailer-form .button { width: 100%; }
  .legal-page { padding: 65px 18px 90px; }
  .legal-page h1 { font-size: 42px; }
}
