/* ========================
   IPFNY — Quote Page Styles
   ======================== */

.quote-hero {
  background: linear-gradient(180deg, var(--body-color) 0%, #f5f9f0 100%);
  padding-block: 7rem 1rem; /* account for fixed header */
  border-bottom: 1px solid var(--gray-border);
}
.quote-hero__wrap { display: grid; }
.quote-hero__text { text-align: center; max-width: 780px; margin: 0 auto; }
.quote-hero__blurb { margin-top: .5rem; color: var(--text-color); }

/* Two-column layout that collapses on mobile */
.quote__grid {
  display: grid;
  gap: 2rem;
  margin-top: 2rem;
}
@media (min-width: 992px) {
  .quote__grid {
    grid-template-columns: 1fr 1.5fr;
    align-items: start;
  }
}

/* Info cards */
.quote__card {
  background: var(--container-color);
  border: 2px solid var(--gray-border);
  padding: 1.5rem;
  box-shadow: 0 6px 20px hsla(255, 8%, 4%, .06);
}
.quote__card + .quote__card { margin-top: 1rem; }
.quote__card-title {
  font-size: var(--h2-font-size);
  display: flex; align-items: center; gap: .5rem;
  margin-bottom: .75rem;
}
.quote__list { display: grid; gap: .5rem; }
.quote__text a { color: var(--title-color); text-decoration: underline; }

/* Form wrapper */
.quote__formwrap {
  background: var(--container-color);
  border: 2px solid var(--gray-border);
  padding: 1.25rem 1.25rem 1.75rem;
  box-shadow: 0 6px 20px hsla(255, 8%, 4%, .06);
}

/* Form grid */
.qform { display: grid; gap: 1.25rem; }
.qform__row {
  display: grid;
  gap: 1rem;
}
@media (min-width: 640px) {
  .qform__row {
    grid-template-columns: 1fr 1fr;
  }
}
/* allow a full-width field in a 2-col row */
.qfield--full { grid-column: 1 / -1; }

/* Fields */
.qfield label {
  display: block;
  font-size: var(--small-font-size);
  font-weight: var(--font-semi-bold);
  color: var(--text-color);
  margin-bottom: .35rem;
}
.qfield input,
.qfield textarea {
  width: 100%;
  padding: .9rem 1rem;
  border: 2px solid var(--black-border);
  background: var(--white-color);
  color: var(--title-color);
  transition: border-color .2s, box-shadow .2s;
  font-family: var(--body-font);
  font-size: var(--normal-font-size);
}
.qfield textarea { resize: vertical; }

/* Focus style consistent with your brand */
.qfield input:focus,
.qfield textarea:focus {
  border-color: var(--first-color);
  box-shadow: 0 0 0 4px rgba(154, 206, 102, .25);
  outline: none;
}

/* Radio groups */
.qgroup {
  border: 2px solid var(--black-border);
  padding: .85rem;
}
.qgroup legend {
  padding: 0 .4rem;
  font-weight: var(--font-bold);
  letter-spacing: .3px;
  color: var(--title-color);
  font-size: var(--small-font-size);
}
.qgroup .qchoice {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-right: 1rem;
  margin-top: .35rem;
  padding: .6rem .9rem;
  border: 2px solid var(--gray-border);
  border-radius: 10px;
  text-transform: uppercase;
  font-weight: var(--font-bold);
  letter-spacing: .2px;
}
.qgroup .qchoice input { accent-color: var(--black-color); }
@media (max-width: 680px) {
  .qgroup .qchoice { display: flex; width: 100%; margin-right: 0; }
}

/* Actions */
.qform__actions {
  display: flex;
  gap: 1rem;
  align-items: center;
  justify-content: flex-end;
}
.qform__actions .button {
  white-space: nowrap;
}
/* =========================
   Brutalist Submit Button
   ========================= */
.qform__actions .button {
  background: var(--black-color);
  color: var(--white-color);
  border: 3px solid var(--black-color);
  border-radius: 0;                 /* square corners */
  padding: 1rem 2rem;
  font-weight: var(--font-bold);
  text-transform: uppercase;
  letter-spacing: 1px;
  
  transition: all .15s ease-in-out;
}

.qform__actions .button:hover {
  background: #252525;
  color: var(--white-color);
  
}
