.trial-page [hidden] { display: none !important; }

.trial-header,
.trial-footer {
  max-width: 1224px;
  margin-inline: auto;
  padding: 22px clamp(20px, 5vw, 55px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.trial-header { border-bottom: 1px solid var(--line); }
.trial-header-link,
.trial-text-button {
  font-weight: 680;
  font-size: .88rem;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.trial-header-link span { margin-left: .25rem; }
.trial-text-button {
  background: transparent;
  text-align: left;
  padding: 7px 0;
}

.trial-main {
  width: min(1120px, calc(100% - 2 * clamp(18px, 5vw, 62px)));
  margin: 0 auto;
  padding-block: clamp(32px, 7vw, 88px) 40px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: clamp(24px, 6vw, 76px);
}

.trial-intro .eyebrow { margin-bottom: 15px; }
.trial-intro h1 {
  font-size: clamp(43px, 5.6vw, 79px);
  line-height: .99;
  letter-spacing: -.057em;
  font-weight: 640;
  margin-bottom: 23px;
}

.trial-intro h1 .serif-accent { color: #244c37; }
.trial-lead {
  color: #435449;
  max-width: 36rem;
  font-size: clamp(15px, 1.65vw, 18px);
  margin-bottom: 25px;
}

.trial-illustration {
  background: radial-gradient(ellipse at 100% 2%, #42654b, #253b31 55%, #192d25);
  border: 1px solid #223d2f;
  border-radius: 19px;
  color: #f2f7eb;
  padding: clamp(20px, 3vw, 30px);
  box-shadow: 0 18px 35px -24px #152b20b5;
}

.trial-illustration > .eyebrow { color: #d9f982; }
.trial-sample-heading { display: flex; gap: 12px; align-items: center; }
.trial-sample-heading strong,
.trial-sample-heading small { display: block; }
.trial-sample-heading small { margin-top: 3px; color: #d5dfd0; }
.trial-sample-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  flex: none;
  background: var(--lime);
  color: var(--ink);
  font-size: 1.5rem;
}

.trial-illustration > p {
  color: #ebf1e8;
  margin: 15px 0 13px;
  font-size: .92rem;
}

.trial-sample-note { font-size: .79rem; color: #d7e3d3; }
.trial-sample-note > span { margin-right: 4px; color: #d9f982; }

.trial-points {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 24px 0 0;
  padding: 0;
}

.trial-points li {
  padding: 10px 0 0;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 5px;
}

.trial-points strong { font-size: clamp(13px, 1.8vw, 16px); }
.trial-points span { color: #506357; font-size: .77rem; }

.trial-access, #signed-out, #dashboard { min-width: 0; }
#signed-out, #dashboard { display: grid; gap: 12px; }
.trial-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: 0 16px 35px -30px #1d412a75;
  padding: clamp(19px, 3vw, 32px);
  overflow-wrap: anywhere;
}

.trial-card .eyebrow { margin-bottom: 9px; }
.trial-card h2,
.trial-confirm h2 {
  margin-bottom: 12px;
  font-size: clamp(27px, 3.3vw, 41px);
  letter-spacing: -.045em;
}

.trial-card h3 { margin-bottom: 8px; font-size: 1.28rem; }
.trial-card p, .trial-confirm p { margin-bottom: 13px; font-size: .9rem; color: #435449; }
.trial-card p:last-child { margin-bottom: 0; }
.trial-form { display: grid; gap: 12px; margin-top: 15px; }
.trial-form .button { justify-self: start; }
.trial-form label { font-size: .85rem; font-weight: 650; }
.trial-form label > span { font-weight: 450; }
.trial-form input:not([type="checkbox"]),
.trial-form textarea {
  display: block;
  width: 100%;
  margin-top: 6px;
  background: #f9faf6;
  border: 1px solid #bac7bc;
  border-radius: 8px;
  padding: 11px 10px;
  color: var(--ink);
  font-size: 1rem;
}

.trial-form > input { margin-top: 0 !important; }
.trial-form textarea { resize: vertical; }
.trial-consent { display: flex; align-items: flex-start; gap: 9px; line-height: 1.5; }
.trial-consent input { width: 17px; height: 17px; accent-color: var(--forest); flex: none; margin: 2px 0 0; }
.trial-consent a,
#privacy-contact a { text-decoration: underline; text-underline-offset: 3px; font-weight: 680; }
#signup-challenge { min-width: 0; }
#signup-challenge:empty { display: none; }

.trial-message {
  font-size: .84rem;
  color: #435449;
  margin: 0;
  line-height: 1.5;
}

.trial-message[data-kind="error"] { color: #9a2822; }
.trial-access > .trial-message { margin-bottom: 10px; }
.trial-details { padding-block: 14px; }
.trial-details summary { cursor: pointer; font-size: .91rem; font-weight: 690; line-height: 1.5; }
.trial-details[open] > p:first-of-type { margin-top: 13px; }
.trial-dashboard-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.trial-status {
  background: #edf1e8;
  border-radius: 20px;
  color: #415547;
  font-size: .77rem;
  font-weight: 730;
  padding: 6px 10px;
  flex: none;
}

.trial-status[data-state="active"] { background: #eaf5cf; color: #2b4c22; }
.trial-button-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 15px; }
.trial-receipt,
.trial-draft-result { background: #eff4e9; padding: 14px; border-radius: 9px; }
.trial-recovery { background: #f2f7e5; }
.trial-recovery code {
  display: block;
  user-select: all;
  margin-bottom: 13px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 12px;
  word-break: break-all;
  font-size: .88rem;
}

.trial-field-grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.trial-draft-result { margin-top: 17px; }
.trial-draft-result h4 { margin: 0 0 8px; }
#draft-text { white-space: pre-wrap; }
.trial-policies { grid-column: 1 / -1; display: grid; gap: 9px; }
.trial-footer {
  border-top: 1px solid var(--line);
  color: #516258;
  font-size: .84rem;
}

.trial-footer a { font-weight: 720; }
.trial-confirm {
  width: min(460px, calc(100% - 28px));
  padding: clamp(18px, 4vw, 31px);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  color: var(--ink);
}

.trial-confirm::backdrop { background: #192d258c; }

@media (max-width: 730px) {
  .trial-main { grid-template-columns: 1fr; gap: 28px; }
}

@media (max-width: 390px) {
  .trial-header-link { font-size: .77rem; }
  .trial-field-grid { grid-template-columns: 1fr; }
}

.trial-jump { display: none; }
@media (max-width: 730px) {
  .trial-jump { display: inline-flex; margin: 0 0 19px; }
}
