/* ---------- Forms ---------- */
.form-panel { background: var(--paper); border: 1px solid var(--line); border-radius: 22px; padding: clamp(1.25rem, 3vw, 2rem); position: sticky; top: 6rem; box-shadow: 0 24px 50px -36px rgba(25,25,54,.35); }
@media (max-width: 900px) { .form-panel { position: static; } }
.form-panel h2 { font-size: var(--step-2); }
.field { margin-bottom: 1.05rem; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
@media (max-width: 560px) { .field-row { grid-template-columns: 1fr; } }
.field label { display: block; font-weight: 600; font-size: .92rem; margin-bottom: .3rem; }
.field__opt { font-weight: 400; color: var(--steel); }
.req { color: var(--orange-deep); }
.field input[type="text"], .field input:not([type]), .field input[type="email"], .field input[type="tel"], .field input[type="url"], .field textarea {
  width: 100%; font: inherit; padding: .7rem .85rem; border: 1px solid #CFCEDD; border-radius: var(--r-input); background: var(--paper); color: var(--night);
}
.field input[type="file"] { font: inherit; font-size: .92rem; max-width: 100%; }
.field input[type="file"]::file-selector-button { font: inherit; font-weight: 600; border: 1px solid var(--line); background: var(--lilac); border-radius: 999px; padding: .35rem .9rem; margin-right: .6rem; cursor: pointer; }
.field textarea { resize: vertical; min-height: 6.5rem; }
.field input:focus, .field textarea:focus { border-color: var(--orange); outline: 3px solid rgba(238, 122, 1, .3); outline-offset: 0; }
.field [aria-invalid="true"] { border-color: var(--err); }
.field__hint { font-size: var(--step--1); color: var(--steel); margin: .3rem 0 0; }
.field__error { color: var(--err); font-size: var(--step--1); font-weight: 600; margin: .3rem 0 0; }
.field--check { display: grid; grid-template-columns: auto 1fr; gap: .6rem; align-items: start; }
.field--check input { width: 1.15rem; height: 1.15rem; margin-top: .25rem; accent-color: var(--orange); }
.field--check label { font-weight: 400; margin: 0; font-size: .9rem; }
.field--check .field__error { grid-column: 2; }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.notice { padding: .9rem 1rem; border-radius: var(--r-input); background: var(--lilac); }
.notice--ok { background: #E3F4EA; color: var(--ok); font-weight: 600; }
.notice--error { background: #FBE7E5; color: var(--err); font-weight: 600; }

.contact-direct { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem; margin: 0 0 2rem; }
.contact-direct p { margin: 0; color: var(--steel); padding: 1.1rem 1.25rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-card); }
.contact-direct__big { font-size: var(--step-1); font-weight: 800; text-decoration: none; color: var(--night); word-break: break-word; }
.contact-direct__big:hover { color: var(--orange-deep); }
.office { font-style: normal; display: flex; flex-direction: column; padding: 1rem 0; border-top: 1px solid var(--line); }
.office strong { margin-bottom: .2rem; }
.office span { color: var(--steel); }

.error-page { padding: clamp(3rem, 10vw, 7rem) 0; }
.error-page__code { font-size: var(--step-5); font-weight: 800; color: var(--orange-deep); margin: 0; line-height: 1; }

/* ---------- Mobile quick contact (Vietnamese visitors call or Zalo first) ---------- */
.quickbar { display: none; }
@media (max-width: 720px) {
  .quickbar { display: flex; gap: .5rem; position: fixed; left: .75rem; right: .75rem; bottom: .75rem; z-index: 60; padding: .45rem; background: var(--night); border-radius: 999px; box-shadow: 0 12px 30px -10px rgba(25,25,54,.6); }
  .quickbar:empty { display: none; }
  .quickbar__btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 2.9rem; border-radius: 999px; color: #fff; text-decoration: none; font-weight: 700; font-size: .95rem; }
  .quickbar__btn:first-child { background: var(--orange-btn); color: var(--on-orange); }
  .quickbar__btn--zalo { background: #0068FF; color: #fff; }
  .quickbar__btn svg { width: 1.1rem; height: 1.1rem; fill: currentColor; }
  body { padding-bottom: 5rem; }
  body.nav-open .quickbar { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
@media print {
  .masthead, .site-footer, .form-panel, .band, .nav-toggle, .quickbar, .hero::before { display: none !important; }
  body { background: #fff; }
}