.nav-conversion-link {
  align-items: center;
  background: var(--ink);
  border-radius: 999px;
  color: var(--paper-bright);
  display: inline-flex;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .04em;
  min-height: 42px;
  padding: 0 1.2rem;
  text-transform: uppercase;
}

.conversion-hero {
  background:
    radial-gradient(circle at 84% 20%, rgba(188, 205, 184, .62), transparent 28rem),
    linear-gradient(135deg, #f8f6ef 0%, #eeefe5 56%, #e3e9dd 100%);
  border-bottom: 1px solid rgba(17, 48, 40, .12);
  padding: clamp(4rem, 8vw, 7.5rem) 0 clamp(3.5rem, 6vw, 6rem);
}

.conversion-hero-grid {
  align-items: end;
  display: grid;
  gap: clamp(2rem, 6vw, 6rem);
  grid-template-columns: minmax(0, 1.35fr) minmax(18rem, .65fr);
}

.conversion-title {
  font-size: clamp(3rem, 5.8vw, 6.25rem);
  letter-spacing: -.055em;
  line-height: .94;
  max-width: 13ch;
}

.brief-principle {
  background: rgba(255, 255, 255, .7);
  border: 1px solid rgba(17, 48, 40, .13);
  border-radius: 1.35rem;
  box-shadow: 0 1.5rem 4rem rgba(17, 48, 40, .08);
  padding: 1.5rem;
}

.brief-principle > span {
  color: var(--accent);
  display: block;
  font-family: var(--font-display);
  font-size: 2rem;
  margin-bottom: 1.5rem;
}

.brief-principle strong {
  color: var(--ink);
  display: block;
  font-size: 1.05rem;
  margin-bottom: .5rem;
}

.brief-principle p,
.flow-assurance p,
.form-submit p,
.internal-conversion-panel p {
  color: var(--muted);
  line-height: 1.65;
  margin: 0;
}

.conversion-workspace {
  background: var(--paper);
  padding: clamp(3rem, 6vw, 6rem) 0 7rem;
}

.conversion-layout {
  align-items: start;
  display: grid;
  gap: clamp(2rem, 5vw, 5.5rem);
  grid-template-columns: minmax(16rem, .65fr) minmax(0, 1.55fr);
}

.flow-rail {
  position: sticky;
  top: 7rem;
}

.flow-rail ol {
  list-style: none;
  margin: 1.5rem 0;
  padding: 0;
}

.flow-rail li {
  align-items: start;
  border-top: 1px solid rgba(17, 48, 40, .14);
  display: grid;
  gap: 1rem;
  grid-template-columns: 2.4rem 1fr;
  padding: 1.1rem 0;
}

.flow-rail li > span {
  color: #8b7448;
  font-family: var(--font-display);
  font-size: 1.25rem;
}

.flow-rail strong,
.flow-rail small {
  display: block;
}

.flow-rail strong {
  color: var(--ink);
  margin-bottom: .3rem;
}

.flow-rail small {
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.5;
}

.flow-assurance {
  background: var(--ink);
  border-radius: 1rem;
  color: var(--paper-bright);
  padding: 1.25rem;
}

.flow-assurance p {
  color: rgba(255, 255, 255, .72);
  font-size: .85rem;
  margin-top: .5rem;
}

.conversion-main {
  min-width: 0;
}

.source-context {
  align-items: start;
  background: #edf1e8;
  border: 1px solid rgba(17, 48, 40, .12);
  border-radius: 1.25rem;
  display: grid;
  gap: 1.5rem;
  grid-template-columns: minmax(0, 1fr) minmax(14rem, .8fr);
  margin-bottom: 1.5rem;
  padding: 1.5rem;
}

.source-context h2 {
  font-family: var(--font-display);
  font-size: 1.45rem;
  letter-spacing: -.025em;
  margin: .3rem 0 0;
}

.source-context dl,
.internal-conversion-panel dl,
.brief-summary {
  display: grid;
  gap: .7rem;
  margin: 0;
}

.source-context dl div,
.internal-conversion-panel dl div,
.brief-summary div {
  display: grid;
  gap: .25rem;
  grid-template-columns: minmax(6rem, .6fr) minmax(0, 1fr);
}

.source-context dt,
.internal-conversion-panel dt,
.brief-summary dt {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.source-context dd,
.internal-conversion-panel dd,
.brief-summary dd {
  color: var(--ink);
  margin: 0;
  overflow-wrap: anywhere;
}

.conversion-form,
.conversion-result {
  background: var(--paper-bright);
  border: 1px solid rgba(17, 48, 40, .13);
  border-radius: 1.5rem;
  box-shadow: 0 1.5rem 4.5rem rgba(17, 48, 40, .075);
  overflow: hidden;
}

.form-heading {
  align-items: end;
  background: #f8f7f1;
  border-bottom: 1px solid rgba(17, 48, 40, .12);
  display: flex;
  justify-content: space-between;
  padding: clamp(1.5rem, 4vw, 2.5rem);
}

.form-heading h2 {
  font-family: var(--font-display);
  font-size: clamp(2rem, 3vw, 3rem);
  letter-spacing: -.04em;
  margin: .35rem 0 0;
}

.form-heading > span {
  color: var(--muted);
  font-size: .82rem;
}

.form-alert {
  background: #fff0ea;
  border-bottom: 1px solid #d4957d;
  color: #783b29;
  font-weight: 700;
  padding: 1rem clamp(1.5rem, 4vw, 2.5rem);
}

.form-section {
  border: 0;
  border-bottom: 1px solid rgba(17, 48, 40, .11);
  margin: 0;
  padding: clamp(2rem, 4vw, 3rem) clamp(1.5rem, 4vw, 2.5rem);
}

.form-section legend {
  display: flex;
  flex-direction: column;
  margin-bottom: 1.75rem;
  padding: 0;
  width: 100%;
}

.form-section legend span {
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 1.65rem;
  letter-spacing: -.025em;
}

.form-section legend small {
  color: var(--muted);
  font-size: .88rem;
  margin-top: .35rem;
}

.field-grid {
  display: grid;
  gap: 1.35rem 1.5rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.form-field {
  min-width: 0;
}

.form-field.field-wide {
  grid-column: 1 / -1;
}

.form-field label {
  color: var(--ink);
  display: block;
  font-size: .86rem;
  font-weight: 700;
  margin-bottom: .55rem;
}

.form-field input,
.form-field select,
.form-field textarea {
  appearance: none;
  background: #fbfbf7;
  border: 1px solid #bdc7be;
  border-radius: .72rem;
  color: var(--ink);
  font: inherit;
  font-size: 1rem;
  line-height: 1.45;
  min-height: 3.25rem;
  padding: .82rem .95rem;
  width: 100%;
}

.form-field textarea {
  min-height: 7.5rem;
  resize: vertical;
}

.form-field select {
  background-image: linear-gradient(45deg, transparent 50%, #173a31 50%), linear-gradient(135deg, #173a31 50%, transparent 50%);
  background-position: calc(100% - 18px) 1.4rem, calc(100% - 13px) 1.4rem;
  background-repeat: no-repeat;
  background-size: 5px 5px;
  padding-right: 2.5rem;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  border-color: var(--ink);
  box-shadow: 0 0 0 3px rgba(55, 103, 89, .15);
  outline: none;
}

.field-hint {
  color: var(--muted);
  display: block;
  font-size: .76rem;
  margin-top: .45rem;
}

.field-error {
  color: #a13f2c;
  font-size: .8rem;
  font-weight: 700;
  margin: .4rem 0 0;
  min-height: 1.15rem;
}

.consent-panel {
  background: #f4f4ed;
  border: 0;
  border-bottom: 1px solid rgba(17, 48, 40, .11);
  margin: 0;
  padding: 1.75rem clamp(1.5rem, 4vw, 2.5rem);
}

.consent-panel legend {
  color: var(--ink);
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .08em;
  padding-top: 1rem;
  text-transform: uppercase;
}

.consent-row {
  align-items: start;
  color: var(--ink);
  display: grid;
  font-size: .88rem;
  gap: .8rem;
  grid-template-columns: 1.15rem 1fr;
  line-height: 1.55;
  margin-top: .8rem;
}

.consent-row input {
  height: 1.15rem;
  margin: .18rem 0 0;
  width: 1.15rem;
}

.consent-row em {
  color: var(--muted);
  font-style: normal;
}

.form-submit {
  align-items: center;
  display: flex;
  gap: 2rem;
  justify-content: space-between;
  padding: clamp(1.5rem, 4vw, 2.5rem);
}

.form-submit strong {
  color: var(--ink);
  display: block;
  margin-bottom: .25rem;
}

.form-submit p {
  font-size: .8rem;
  max-width: 38rem;
}

.conversion-result {
  padding: clamp(2rem, 5vw, 4rem);
  scroll-margin-top: 5rem;
}

.conversion-result[hidden] {
  display: none;
}

.conversion-result h2 {
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  letter-spacing: -.05em;
  line-height: 1;
  margin: .8rem 0 1rem;
}

.conversion-result > p {
  color: var(--muted);
  line-height: 1.65;
  max-width: 46rem;
}

.success-mark {
  align-items: center;
  background: var(--ink);
  border-radius: 50%;
  color: #d7ff5f;
  display: flex;
  font-size: 1.4rem;
  height: 3rem;
  justify-content: center;
  margin-bottom: 1.5rem;
  width: 3rem;
}

.brief-summary {
  border-bottom: 1px solid rgba(17, 48, 40, .12);
  border-top: 1px solid rgba(17, 48, 40, .12);
  margin: 2rem 0;
  padding: 1.5rem 0;
}

.success-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
}

.internal-summary {
  background: #eef0e7;
  border-radius: .8rem;
  margin-top: 2rem;
  padding: 1rem;
}

.internal-summary summary {
  cursor: pointer;
  font-weight: 700;
}

.internal-summary pre {
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.6;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.internal-conversion-panel {
  background: #192f29;
  color: var(--paper-bright);
  padding: 2rem 0;
}

.internal-grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: 1.1fr .9fr;
}

.internal-conversion-panel h2 {
  font-family: var(--font-display);
  font-size: 2rem;
  margin: .35rem 0 .7rem;
}

.internal-conversion-panel p,
.internal-conversion-panel dt {
  color: rgba(255, 255, 255, .68);
}

.internal-conversion-panel dd {
  color: #eef2e8;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: .78rem;
}

.conversion-entry {
  padding-top: 0;
}

.conversion-entry-panel {
  align-items: center;
  background: linear-gradient(120deg, #183a31, #254d41);
  border-radius: 1.5rem;
  color: var(--paper-bright);
  display: grid;
  gap: 2rem;
  grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .8fr);
  padding: clamp(2rem, 5vw, 4rem);
}

.conversion-entry-panel .title-lg {
  color: var(--paper-bright);
  margin: .5rem 0;
}

.conversion-entry-panel p {
  color: rgba(255, 255, 255, .72);
  line-height: 1.6;
  margin-bottom: 0;
}

.conversion-entry-panel .button-row {
  justify-content: flex-end;
}

.conversion-entry-panel .button-secondary {
  border-color: rgba(255, 255, 255, .5);
  color: var(--paper-bright);
}

@media (max-width: 900px) {
  .nav-conversion-link { display: none; }
  .conversion-hero-grid,
  .conversion-layout,
  .internal-grid,
  .conversion-entry-panel { grid-template-columns: 1fr; }
  .flow-rail { position: static; }
  .flow-rail ol { display: grid; grid-template-columns: repeat(3, 1fr); }
  .flow-rail li { border-bottom: 1px solid rgba(17, 48, 40, .14); }
  .conversion-entry-panel .button-row { justify-content: flex-start; }
}

@media (max-width: 620px) {
  .conversion-hero { padding: 3.25rem 0 2.75rem; }
  .conversion-title { font-size: clamp(2.75rem, 13vw, 4rem); }
  .brief-principle { padding: 1.2rem; }
  .conversion-workspace { padding: 2.5rem 0 5rem; }
  .flow-rail ol { grid-template-columns: 1fr; }
  .flow-rail li { grid-template-columns: 2rem 1fr; }
  .source-context { grid-template-columns: 1fr; }
  .field-grid { grid-template-columns: 1fr; }
  .form-field.field-wide { grid-column: auto; }
  .form-heading,
  .form-submit { align-items: stretch; flex-direction: column; }
  .form-submit .button { justify-content: center; width: 100%; }
  .source-context dl div,
  .internal-conversion-panel dl div,
  .brief-summary div { grid-template-columns: 1fr; }
  .conversion-entry-panel .button-row,
  .success-actions { flex-direction: column; }
  .conversion-entry-panel .button,
  .success-actions .button { justify-content: center; width: 100%; }
}

/* Accepted premium hierarchy refinement: Product Brief document. */
body[data-page="build-your-product"] .conversion-workspace { padding-block:clamp(5rem,8vw,8rem);background:#f5f1e8; }
body[data-page="build-your-product"] .conversion-layout { grid-template-columns:minmax(210px,.34fr) minmax(0,1fr);gap:clamp(3rem,7vw,8rem);max-width:1240px; }
body[data-page="build-your-product"] .flow-rail { border:0;border-top:1px solid #c5a86c;border-radius:0;background:transparent;box-shadow:none; }
body[data-page="build-your-product"] .conversion-form { border:0;border-radius:0;background:transparent;box-shadow:none; }
body[data-page="build-your-product"] .form-heading h2 { max-width:12ch;font-size:clamp(3rem,5vw,5.2rem);line-height:.94; }
body[data-page="build-your-product"] .form-section { padding:2.75rem 0;border:0;border-top:1px solid rgba(18,56,46,.18);border-radius:0;background:transparent; }
body[data-page="build-your-product"] .form-field :is(input,select,textarea) { border-width:0 0 1px;border-radius:0;background:rgba(255,253,247,.36);box-shadow:none; }

@media (max-width:900px) {
  body[data-page="build-your-product"] .conversion-layout { grid-template-columns:1fr; }
  body[data-page="build-your-product"] .flow-rail { position:static; }
}

@media (max-width:600px) {
  body[data-page="build-your-product"] .conversion-workspace { padding-block:4.5rem; }
  body[data-page="build-your-product"] .form-section { padding-block:2rem; }
}


/* Human-approved sitewide reading scale, 2026-10-08. Typography only. */
body .form-field label,body .consent-row,body .consent-panel legend { font-size:var(--yz-reading-support);line-height:1.6; }
body :is(.field-hint,.field-error,.brief-principle p,.form-submit p,.brief-rail p) { font-size:var(--yz-reading-support);line-height:1.6; }
body .form-field :is(input,select,textarea) { font-size:1rem; }
body .form-section legend small { font-size:var(--yz-reading-note);line-height:1.6; }

body .flow-assurance p {font-size:var(--yz-reading-support);line-height:1.6;}

.conversion-form .form-service-notice {padding:20px 24px;margin:0 0 28px;border-left:3px solid #a47730;background:#f0ece2;color:#17392f;font-size:17px;line-height:1.7;}
.conversion-form .form-service-notice a,.conversion-form .field-hint a {text-decoration:underline;text-underline-offset:4px;}
.conversion-form button:disabled {cursor:not-allowed;opacity:.6;}
.conversion-form input[type="file"]:disabled {cursor:not-allowed;}