/* ============================================================
   A/S 문의(/as) 전용 스타일 — front/pages/as.vue 이식
   ============================================================ */
.sec { padding: 130px 0; background: #fff; }
.as-inner { display: flex; gap: 90px; align-items: flex-start; }
.as-copy { flex: 1; }
.as-copy .sec-title { margin-top: 18px; line-height: 1.32; font-size: clamp(28px, 3.2vw, 46px); }
.a-sub { margin-top: 24px; line-height: 1.84; font-size: 16.5px; }

.q-info { margin-top: 40px; display: flex; flex-direction: column; }
.q-hr { height: 1px; background: var(--line); }
.q-row { display: flex; align-items: center; gap: 26px; padding: 20px 0; }
.q-row .t {
  width: 74px; flex: none; text-align: center;
  background: var(--bg-thumb); border-radius: 6px; padding: 7px 0;
  color: var(--muted); font-weight: 700; font-size: 11px; letter-spacing: 1.1px;
}
.q-row .v { color: var(--ink); font-weight: 500; font-size: 17px; letter-spacing: -0.02em; }
.q-row .v.tel { font-weight: 700; font-size: 26px; }
.benefits { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 10px; }
.benefits .chip {
  display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px 11px 16px; border-radius: 8px;
  background: var(--bg-card); border: 1px solid var(--line);
  color: var(--body-2); font-weight: 500; font-size: 14px; letter-spacing: -0.01em;
}
.benefits .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--primary); }

.as-form {
  width: 660px; max-width: 100%; flex: none;
  background: var(--bg-card); border: 1px solid var(--line); border-radius: 12px;
  padding: 46px; box-shadow: var(--shadow-card);
  display: flex; flex-direction: column; gap: 20px;
}
.as-form h3 { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; color: var(--ink); }
.as-form .f-sub { margin-top: -10px; color: var(--muted); font-size: 14.5px; letter-spacing: -0.01em; }
.f-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.chips { display: flex; gap: 8px; }
.chips .chip-btn { flex: 1; padding: 13px 0; }
.f-submit { margin-top: 6px; width: 100%; padding: 22px; font-size: 17px; }
.f-submit:disabled { opacity: 0.6; }

@media (max-width: 1240px) {
  .as-inner { flex-direction: column; gap: 60px; }
  .as-form { width: 100%; }
}
@media (max-width: 900px) {
  .sec { padding: 80px 0; }
}
@media (max-width: 560px) {
  .as-form { padding: 32px 22px; }
  .f-row { grid-template-columns: 1fr; }
  .q-row .v.tel { font-size: 22px; }
}