/* Shared form layout for the bridal and occasion-wear pages. */
.hdr { background: #fff; color: #1d1d1d; border-bottom: 1px solid #ece8e5; }
.hdr .hdr-in { justify-content: center; min-height: 80px; padding-block: 12px; }
.brand-mark { position: relative; display: block; width: 148px; height: 56px; overflow: hidden; }
.brand-mark img { position: absolute; width: 176px; max-width: none; height: auto; left: -16px; top: -14px; display: block; }
.hero .pic { grid-column: 1; grid-row: 1; }
.hero .txt { grid-column: 2; grid-row: 1; }
.hero-prompt {
  grid-column: 1;
  grid-row: 1;
  align-self: end;
  z-index: 1;
  margin: 0;
  padding: clamp(5rem, 12vw, 9rem) clamp(1.25rem, 4vw, 3rem) clamp(1.25rem, 3vw, 2rem);
  color: #fff;
  background: linear-gradient(to bottom, transparent, rgba(13, 10, 10, .26) 42%, rgba(13, 10, 10, .82));
  font: 400 clamp(14px, 1.5vw, 18px)/1.55 var(--serif);
  text-align: center;
  text-wrap: balance;
  pointer-events: none;
}
@media (max-width: 820px) {
  .hero .pic { min-height: 340px; }
  .hero .txt { grid-column: 1; grid-row: 2; }
  .hero-prompt { padding: 5rem 1.2rem 1.2rem; font-size: 14px; }
}
.form-overview {
  margin: 0;
  font-size: 12px;
  color: #666;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.form-overview span {
  margin-left: 0;
  color: #666;
  font-size: 12px;
}
.prog { position: static; padding: 20px 0; }
.prog .prog-in {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  padding: 0;
  overflow: visible;
}
.prog-in a {
  color: #666;
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-decoration: none;
}
.prog-in a:hover, .prog-in a:focus-visible { color: #111; text-decoration: underline; }
.question-number {
  margin: 0 0 14px;
  color: #666;
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.budget-section {
  padding-block: clamp(2.5rem, 5vw, 3.5rem);
  border-block: 1px solid var(--rule);
  background: #fff;
  scroll-margin-top: 30px;
}
.section-help, .choice-help {
  color: #666;
  font-size: 14px;
  line-height: 1.7;
  margin: 12px 0 20px;
}
.budget-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 24px; margin-top: 28px; }
.budget-field label { display: block; color: #333; font-size: 13px; margin-bottom: 12px; }
.budget-field select { width: 100%; min-height: 56px; font-size: 16px; padding: 14px; background-color: #fff; color: #111; }
.budget-field select:disabled { opacity: 1; color: #666; background-color: #f5f5f5; }
.budget-field .section-help { margin-bottom: 0; font-size: 13px; }
.contact .grid2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#studioForm .contact { padding-bottom: clamp(1.5rem, 3vw, 2.25rem); }
#studioForm.studio-pending .contact { padding-bottom: 1.5rem; }
#contactError:empty { display: none; }
#enterStudio { margin-top: 1.5rem; }
#studioForm.studio-pending + .worn { padding-top: 1.5rem; }
.final-submit { padding-bottom: 3rem; }
.marqbtn:disabled { opacity: .35; cursor: default; }
.mcard { cursor: zoom-in; }
.mcard[role="button"]:focus-visible { outline: 2px solid #222; outline-offset: 4px; }
.worn-lightbox[hidden] { display: none; }
.worn-lightbox {
  position: fixed; inset: 0; z-index: 1100; display: flex; align-items: center; justify-content: center;
  padding: clamp(20px, 5vw, 56px); background: rgba(12, 12, 12, .94);
}
.worn-lightbox figure { margin: 0; max-width: min(88vw, 720px); max-height: 90vh; display: grid; justify-items: center; gap: 14px; }
.worn-lightbox img { display: block; max-width: 100%; max-height: calc(90vh - 48px); width: auto; height: auto; object-fit: contain; }
.worn-lightbox figcaption { color: #fff; font-size: 12px; letter-spacing: .15em; text-align: center; text-transform: uppercase; }
.worn-lightbox-close {
  position: absolute; top: max(16px, env(safe-area-inset-top)); right: max(16px, env(safe-area-inset-right));
  width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.45); border-radius: 50%;
  background: rgba(0,0,0,.3); color: #fff; font-size: 30px; line-height: 1; cursor: pointer;
}
.worn-lightbox-close:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.submit:disabled { opacity: .55; cursor: wait; }
#retrySave[hidden], .studio-loading[hidden] { display: none; }
.studio-loading {
  position: fixed; inset: 0; z-index: 1000; background: #fff;
  display: grid; place-items: center; text-align: center; padding: 24px;
}
.studio-loading h2 { font-size: clamp(22px, 4vw, 32px); margin: 24px 0 12px; }
.studio-loading p { color: #666; font-size: 14px; }
.studio-loader { display: inline-block; width: 36px; height: 36px; border: 2px solid #ddd; border-top-color: #111; border-radius: 50%; animation: studio-spin 1s linear infinite; }
@keyframes studio-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .studio-loader { animation: none; } }

.fld .telrow {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  gap: 8px;
  align-items: stretch;
}

.fld .telrow select,
.fld .telrow input {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  font-size: 16px;
  line-height: 1.5;
}

.fld .telrow select {
  padding: .75rem .5rem;
}

.fld .telrow input {
  padding: .75rem .8rem;
}

@media (max-width: 820px) {
  .contact .grid2 {
    grid-template-columns: minmax(0, 1fr);
  }
}