/* ============================================================
   Submit Information page
   ============================================================ */

.sub-head{
  background:var(--ink); color:var(--on-dark);
  padding-top:calc(74px + clamp(3rem,7vw,5.5rem));
  padding-bottom:clamp(2.5rem,5vw,4rem);
  position:relative;
}
.sub-head::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:linear-gradient(90deg, var(--moss), transparent 55%);
}
.sub-head h1{ font-size:var(--step-4); margin:0 0 .75rem; max-width:18ch; }
.sub-head p{ font-size:var(--step-0); color:var(--on-dark-mute); max-width:50ch; margin:0; line-height:1.7; }

/* ── Layout ── */
.sub-body{
  padding-block:clamp(3rem,6vw,5rem);
}
.sub-inner{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  gap:clamp(2.5rem,6vw,6rem);
  align-items:start;
}
@media (max-width:860px){ .sub-inner{ grid-template-columns:1fr; } }

/* ── Left: context ── */
.sub-context h2{ font-size:var(--step-2); margin:0 0 1rem; }
.sub-context p{ font-size:var(--step--1); color:var(--on-light-mute); line-height:1.7; margin-bottom:.9rem; }

.sub-types{ list-style:none; margin:1.5rem 0 0; padding:0; display:grid; gap:.55rem; }
.sub-types li{
  display:flex; gap:.75rem; align-items:flex-start;
  padding:.7rem .85rem; border-radius:11px;
  background:var(--paper-2); border:1px solid var(--line-light);
  font-size:var(--step--1); line-height:1.55;
}
.sub-types li::before{
  content:''; flex:0 0 7px; width:7px; height:7px;
  border-radius:50%; background:var(--moss); margin-top:.42rem;
}
.sub-types li strong{
  display:block; font-family:var(--ui); font-weight:700;
  font-size:.78rem; color:var(--on-light); margin-bottom:.15rem;
}

.sub-note{
  margin-top:1.5rem; padding:.85rem 1rem;
  border-radius:0 10px 10px 0;
  border-left:3px solid var(--fog);
  background:var(--paper-2);
  font-family:var(--ui); font-size:.76rem;
  color:var(--on-light-mute); line-height:1.6;
}

/* ── Right: form ── */
.sub-form-wrap{
  background:var(--paper-2); border:1px solid var(--line-light);
  border-radius:20px; padding:clamp(1.5rem,3vw,2.25rem);
  position:sticky; top:calc(74px + 1.5rem);
}
@media (max-width:860px){ .sub-form-wrap{ position:static; } }

.sub-form-wrap h3{
  font-size:var(--step-1); margin:0 0 .3rem;
}
.sub-form-wrap > p{
  font-size:var(--step--1); color:var(--on-light-mute);
  margin:0 0 1.5rem; line-height:1.6;
}

/* Form fields */
.sub-field{ display:flex; flex-direction:column; gap:.35rem; margin-bottom:1rem; }
.sub-field label{
  font-family:var(--ui); font-size:.74rem; font-weight:700;
  color:var(--on-light); letter-spacing:0.01em;
}
.sub-field label .sub-optional{
  font-weight:400; color:var(--on-light-mute); margin-left:.35rem;
}
.sub-field input,
.sub-field select,
.sub-field textarea{
  width:100%; padding:.7rem .9rem;
  border:1px solid var(--line-light); border-radius:10px;
  background:var(--paper); color:var(--on-light);
  font-family:var(--body); font-size:var(--step--1);
  line-height:1.5; appearance:none;
  transition:border-color .22s var(--ease-out), box-shadow .22s var(--ease-out);
}
.sub-field input:focus,
.sub-field select:focus,
.sub-field textarea:focus{
  outline:none; border-color:var(--moss);
  box-shadow:0 0 0 3px rgba(46,115,97,0.15);
}
.sub-field textarea{ resize:vertical; min-height:130px; }
.sub-field select{ cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238DA6A5' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right .9rem center; padding-right:2.5rem; }

/* Submit button */
.sub-submit{
  width:100%; margin-top:.5rem;
  padding:1rem; border-radius:999px; border:none;
  background:var(--moss); color:#F3FBF7;
  font-family:var(--ui); font-size:var(--step--1); font-weight:700;
  cursor:pointer; letter-spacing:.01em;
  transition:background-color .28s var(--ease-out), transform .22s var(--ease-out),
             box-shadow .28s var(--ease-out);
}
.sub-submit:hover,.sub-submit:focus-visible{
  background:var(--moss-deep); transform:translateY(-2px);
  box-shadow:0 12px 28px -12px rgba(46,115,97,0.7); outline:none;
}
.sub-submit:disabled{
  opacity:.55; pointer-events:none;
}

/* Success state */
.sub-success{
  display:none; text-align:center; padding:2rem 1rem;
}
.sub-success.is-visible{ display:block; }
.sub-success__icon{
  width:52px; height:52px; border-radius:50%;
  background:rgba(46,115,97,0.12); border:2px solid var(--moss);
  display:grid; place-items:center; margin:0 auto 1rem;
  font-size:1.3rem;
}
.sub-success h4{ font-size:var(--step-1); margin:0 0 .4rem; }
.sub-success p{ font-size:var(--step--1); color:var(--on-light-mute); margin:0; }

/* Formspree placeholder notice */
.sub-formspree-note{
  background:var(--ink); color:var(--on-dark-mute);
  border-radius:10px; padding:.65rem .85rem; margin-bottom:1.1rem;
  font-family:var(--ui); font-size:.7rem; line-height:1.55;
  border:1px solid var(--line-dark);
}
.sub-formspree-note a{ color:var(--moss-lt); }


/* ── Business-owner callout ─────────────────────────────── */
.sub-biz-callout{
  display:none;
  margin-top:1.25rem; padding:1.1rem 1.15rem;
  background:var(--ink); color:var(--on-dark);
  border-radius:14px; border:1px solid var(--line-dark);
  animation:subFadeIn .4s var(--ease-out);
}
.sub-biz-callout.is-visible{ display:block; }
@keyframes subFadeIn{ from{ opacity:0; transform:translateY(-6px);} to{ opacity:1; transform:none; } }

.sub-biz-callout__badge{
  display:inline-flex; align-items:center; gap:.4rem;
  font-family:var(--ui); font-size:.68rem; font-weight:700;
  letter-spacing:0.04em; text-transform:uppercase;
  color:var(--moss-lt); margin-bottom:.6rem;
}
.sub-biz-callout__badge::before{
  content:''; width:6px; height:6px; border-radius:50%; background:var(--moss-lt); flex:0 0 6px;
}
.sub-biz-callout h4{
  font-size:var(--step-0); margin:0 0 .5rem; color:var(--on-dark);
}
.sub-biz-callout p{
  font-size:.83rem; color:var(--on-dark-mute); line-height:1.65; margin:0 0 .75rem;
}
.sub-biz-callout p:last-of-type{ margin-bottom:0; }
.sub-biz-callout a{ color:var(--moss-lt); text-underline-offset:3px; font-weight:600; }
.sub-biz-callout a:hover{ color:var(--on-dark); }

.sub-verified-note{
  display:flex; align-items:flex-start; gap:.6rem;
  margin-top:.9rem; padding-top:.9rem; border-top:1px solid var(--line-dark);
}
.sub-verified-note__icon{
  flex:0 0 20px; width:20px; height:20px; border-radius:50%;
  background:rgba(87,167,143,0.15); border:1px solid rgba(87,167,143,0.4);
  display:grid; place-items:center; font-size:.65rem; color:var(--moss-lt); margin-top:.1rem;
}
.sub-verified-note p{ font-size:.78rem; margin:0; }