/* 11/08 대표: 의뢰서 등록 — 유리 디자인 + 시안 10번
   (번호→✓, 예산·마감 2열, 오른쪽 실시간 미리보기 체크리스트, 아래 '의뢰 올리기' 막대 + 진행 점) */
.rq-main, .rq-dock { --rg-glass: linear-gradient(155deg, rgba(255,255,255,.66), rgba(240, 242, 242,.42));
  --rg-edge: 0 0 0 1px rgba(255,255,255,.8) inset, 0 0 0 1px rgba(27, 58, 61,.06), 0 22px 50px -26px rgba(27, 58, 61,.4);
  --rg-ck: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.4l2.7 2.7L12 5.3' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
body.rq-page::before { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(520px 420px at 12% 30%, rgba(114, 168, 174,.34), transparent 70%), radial-gradient(480px 380px at 88% 18%, rgba(32, 136, 136,.32), transparent 70%), radial-gradient(560px 460px at 70% 85%, rgba(147, 188, 193,.28), transparent 70%); }

/* 유리판 두 장: '말로 쓰기' 상자 + 의뢰서 */
.rq-main .rt-box { background: var(--rg-glass); -webkit-backdrop-filter: blur(20px) saturate(1.2); backdrop-filter: blur(20px) saturate(1.2); box-shadow: var(--rg-edge); border: 0; border-radius: 28px; }
.rq-main .rt-box::before, .rq-main .rt-box::after { display: none; }
.rq-main .m-form { background: var(--rg-glass); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); box-shadow: var(--rg-edge); border: 0; border-radius: 28px; }
.rq-main .m-form::before, .rq-main .m-form::after { display: none; }
.rq-main .rq-ex { border: 0; background: rgba(255,255,255,.5); box-shadow: 0 0 0 1px rgba(255,255,255,.9) inset, 0 10px 24px -18px rgba(27, 58, 61,.35); border-radius: 20px; }
.rq-main .m-form input:not([type=radio]):not([type=checkbox]):not([type=file]), .rq-main .m-form textarea, .rq-main .m-form select, .rq-main .rt-box textarea {
  background-color: rgba(255,255,255,.72); border: 0; box-shadow: 0 0 0 1px rgba(27, 58, 61,.1); border-radius: 14px; transition: box-shadow .2s, background-color .2s; }
.rq-main .m-form input:not([type=radio]):not([type=checkbox]):not([type=file]):focus, .rq-main .m-form textarea:focus, .rq-main .rt-box textarea:focus {
  background-color: #FAFAFA; box-shadow: 0 0 0 2px #2b6970, 0 8px 20px -10px rgba(27, 58, 61,.4); outline: none; }
.rq-main .m-form [aria-invalid="true"] { box-shadow: 0 0 0 2px #208787 !important; }

/* 예산·마감 날짜 한 줄 */
@media (min-width: 640px) {
  .rq-main .m-form { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
  .rq-main .m-form > * { grid-column: 1 / -1; min-width: 0; }
  .rq-main .m-form > .rq-half { grid-column: auto; }
}
.rq-main .rq-hint { margin-bottom: 18px; }

/* 번호 → 채우면 ✓ */
.rq-main .m-form > .m-field > label:first-child::before, .rq-main .m-form > fieldset > legend::before {
  width: 22px; height: 22px; min-width: 0; margin-right: 10px; line-height: 22px; text-align: center; vertical-align: 1px; border-radius: 50%;
  box-shadow: 0 0 0 1.5px rgba(27, 58, 61,.25); font-size: 10px; transition: background-color .25s, box-shadow .25s; }
.rq-main .m-form > .is-ok > label:first-child::before, .rq-main .m-form > .is-ok > legend::before {
  content: ''; background: #2b6970 var(--rg-ck) center / 13px no-repeat; box-shadow: 0 0 0 4px rgba(114, 168, 174,.2); vertical-align: -5px; }

/* 오른쪽: 실시간 미리보기 */
.rq-main .m-split__side { top: 100px; }
.rq-main .m-split__side.has-prev .m-side-card { display: none; }
.rq-prev { padding: 22px; border-radius: 26px; background: var(--rg-glass); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); box-shadow: var(--rg-edge); }
.rq-prev__h { margin: 0; font-size: 13px; color: #7f7f86; font-weight: 800; }
.rq-prev__t { display: block; margin: 6px 0 14px; font-size: 20px; line-height: 1.35; color: #1e2a2b; word-break: keep-all; overflow-wrap: anywhere; }
.rq-prev__t.is-empty { color: #208787; font-size: 16px; font-weight: 600; }
.rq-prev__list { position: relative; margin: 0; padding: 0 0 0 4px; }
.rq-prev__list::before { content: ''; position: absolute; left: 13px; top: 14px; bottom: 14px; width: 2px; border-radius: 2px; background: rgba(27, 58, 61,.14); }
.rq-prev__row { position: relative; display: flex; align-items: center; gap: 12px; padding: 6px 0; font-size: 14px; }
.rq-prev__row s { flex: none; z-index: 1; width: 20px; height: 20px; border-radius: 50%; background: #f5fafa; box-shadow: 0 0 0 2px rgba(27, 58, 61,.22); }
.rq-prev__row.is-ok s { background: #2b6970 var(--rg-ck) center / 12px no-repeat; box-shadow: none; }
.rq-prev__row.is-need s { box-shadow: 0 0 0 2px #208787; }
.rq-prev__row dt { flex: none; width: 36px; color: #7f7f86; }
.rq-prev__row dd { margin: 0; min-width: 0; font-weight: 700; color: #1e2a2b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rq-prev__row.is-need dd { color: #208787; font-weight: 600; }
.rq-prev__row.is-skip dd { color: #98989e; font-weight: 500; }
.rq-prev__s { margin: 10px 0 0; font-size: 13px; color: #65656b; }
.rq-prev__more { margin: 12px 0 0; font-size: 13px; }

/* 아래 고정 '의뢰 올리기' 막대 */
.rq-dock { position: fixed; z-index: 60; bottom: 18px; left: var(--rg-dl, 50%); width: var(--rg-dw, 640px); box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 10px 10px 20px; border-radius: 999px; background: rgba(245, 250, 250,.88); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  box-shadow: 0 0 0 1px rgba(255,255,255,.8) inset, 0 0 0 1px rgba(27, 58, 61,.06), 0 18px 40px -12px rgba(0,0,0,.28); font-size: 14px; transition: opacity .25s, transform .25s; }
.rq-dock[hidden] { display: flex; opacity: 0; transform: translateY(16px); pointer-events: none; visibility: hidden; }
.rq-dock__l { display: flex; align-items: center; gap: 10px; min-width: 0; }
.rq-dock__dots { display: flex; gap: 5px; flex: none; }
.rq-dock__dots i { width: 18px; height: 18px; border-radius: 50%; background: #f5fafa; box-shadow: 0 0 0 2px rgba(27, 58, 61,.2); }
.rq-dock__dots i.is-ok { background: #2b6970 var(--rg-ck) center / 11px no-repeat; box-shadow: none; }
.rq-dock__dots i.is-need { box-shadow: 0 0 0 2px #208787; }
.rq-dock__msg { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #3c4647; }
.rq-dock__msg em { font-style: normal; font-weight: 700; color: #208787; }
.rq-dock .m-btn { flex: none; min-height: 44px; border-radius: 999px; padding: 0 22px; }
@media (max-width: 899px) {
  .rq-main .m-split__side.has-prev .rq-prev { display: none; }
  .rq-main .m-split__side.has-prev .m-side-card { display: block; }
  .rq-dock { left: 12px; right: 12px; width: auto; bottom: 12px; padding-left: 14px; }
  body.rq-page { padding-bottom: 84px; }
}
@media (max-width: 420px) { .rq-dock__msg { font-size: 13px; } .rq-dock .m-btn { padding: 0 16px; } }

/* 애니메이션 */
@media (prefers-reduced-motion: no-preference) {
  @keyframes rg-up { from { opacity: 0; transform: translateY(16px); } }
  @keyframes rg-pop { 0% { transform: scale(0); } 60% { transform: scale(1.25); } 100% { transform: scale(1); } }
  .rq-main .rt-box { animation: rg-up .6s cubic-bezier(.16,1,.3,1) both; }
  .rq-main .m-form { animation: rg-up .6s .1s cubic-bezier(.16,1,.3,1) both; }
  .rq-prev { animation: rg-up .6s .2s cubic-bezier(.16,1,.3,1) both; }
  .rq-main .m-form > .is-ok > label:first-child::before, .rq-main .m-form > .is-ok > legend::before { animation: rg-pop .45s cubic-bezier(.3,1.5,.5,1) both; }
  .rq-prev__row.is-ok s, .rq-dock__dots i.is-ok { animation: rg-pop .4s cubic-bezier(.3,1.5,.5,1) both; }
  .rq-plan__opt { transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s; }
  .rq-plan__opt:hover { transform: translateY(-3px); }
  .rq-ex__chips button { transition: transform .2s, background-color .2s; }
  .rq-ex__chips button:hover { transform: translateY(-2px); }
}
.rq-main .m-form[hidden] { display: none; }
/* 11/08 대표: 고른 예시는 다시 누르면 취소 — ✕ 표시 */
.rq-ex__chip[aria-pressed="true"]::after { content: ''; display: inline-block; width: 16px; height: 16px; margin-left: 8px; vertical-align: -3px; border-radius: 50%; background: rgba(238, 241, 241,.22) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5.2 5.2l5.6 5.6M10.8 5.2l-5.6 5.6' stroke='%23FAFAFA' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / 12px no-repeat; }
.rq-ex__chip[aria-pressed="true"]:hover::after { background-color: #208787; }
/* 11/08 대표: 맨 위 제목 부분 — 유리판 + 떠 있는 의뢰서 그림(시안 2번). 그림의 동그라미는 제목·예산·마감을 채우면 초록 ✓ */
.rq-hero { position: relative; margin: 0 0 22px; padding: 26px 28px 24px; border-radius: 28px; background: var(--rg-glass); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); box-shadow: var(--rg-edge); overflow: hidden; }
.rq-hero .m-eyebrow { margin-top: 0; }
.rq-hero .m-lead { margin-bottom: 0; }
.rq-hero__doc { position: absolute; right: 34px; top: 50%; width: 150px; margin-top: -92px; padding: 16px 14px; box-sizing: border-box; border-radius: 18px; background: #FAFAFA;
  box-shadow: 0 20px 40px -16px rgba(27, 58, 61,.45), 0 0 0 1px rgba(27, 58, 61,.06); transform: rotate(5deg); }
.rq-hero__doc b { display: block; margin-bottom: 10px; font-size: 12px; color: #7f7f86; }
.rq-hero__doc p { display: flex; align-items: center; gap: 8px; margin: 0 0 9px; font-size: 12.5px; font-weight: 700; color: #1e2a2b; }
.rq-hero__doc i { flex: none; width: 16px; height: 16px; border-radius: 50%; background: #FAFAFA; box-shadow: 0 0 0 2px rgba(27, 58, 61,.25); transition: background .3s, box-shadow .3s; }
.rq-hero__doc p.is-ok i { background: #2b6970 var(--rg-ck) center / 10px no-repeat; box-shadow: none; }
.rq-hero__doc s { display: block; height: 6px; margin: 12px 0 0; border-radius: 4px; background: rgba(27, 58, 61,.08); }
.rq-hero__doc s + s { width: 70%; margin-top: 6px; }
.rq-hero__free { position: absolute; right: 20px; top: 22px; padding: 4px 10px; border-radius: 999px; background: #208787; color: #fff; font-size: 11px; font-weight: 800; transform: rotate(-6deg); box-shadow: 0 6px 14px -6px rgba(32, 135, 135,.7); }
@media (min-width: 760px) { .rq-hero { padding-right: 230px; } }
@media (max-width: 759px) { .rq-hero { padding: 22px 18px 20px; border-radius: 24px; } .rq-hero__doc, .rq-hero__free { display: none; } }
@media (prefers-reduced-motion: no-preference) {
  .rq-hero { animation: rg-up .6s cubic-bezier(.16,1,.3,1) both; }
  .rq-hero__doc { animation: rq-hero-bob 4s ease-in-out infinite; }
  .rq-hero__free { animation: rq-hero-free .6s .5s cubic-bezier(.3,1.5,.5,1) both; }
  .rq-hero__doc p.is-ok i { animation: rg-pop .4s cubic-bezier(.3,1.5,.5,1) both; }
}
@keyframes rq-hero-bob { 50% { transform: rotate(3deg) translateY(-8px); } }
@keyframes rq-hero-free { from { opacity: 0; transform: rotate(-30deg) scale(.4); } }
/* 11/08 대표: 맨 위 제목 부분 글자 더 두껍게 */
.rq-hero .m-h1 { font-weight: 800; letter-spacing: -.035em; }
.rq-hero .m-lead { font-weight: 500; color: #3c4647; }
.rq-hero .m-eyebrow { font-weight: 800; }
.rq-hero__doc b { font-weight: 800; }
.rq-hero__doc p { font-weight: 800; }
@media (min-width: 760px) { .rq-hero { min-height: 196px; display: flex; flex-direction: column; justify-content: center; } }
/* 11/08 대표: 단위를 고르면 예산 칸은 비운 채 흐린 회색 바탕에 'n원부터 시작' */
.rq-main #r-budget:placeholder-shown { background-color: rgba(27, 58, 61,.06) !important; }
.rq-main #r-budget::placeholder { color: #8f8f95; font-weight: 600; }

/* 11/09 대표: 선택 칸은 [더 자세히 쓰기]로 접기 (짝: scripts/page-request-fold.js) */
.rq-fold { margin: 6px 0 18px; border: 1px solid rgba(27, 58, 61, .12); border-radius: 18px; background: rgba(255, 255, 255, .62); }
.rq-fold > summary { list-style: none; display: grid; grid-template-columns: minmax(0, 1fr) 28px; gap: 2px 10px; align-items: center; min-height: 56px; padding: 12px 16px; cursor: pointer; border-radius: 18px; }
.rq-fold > summary::-webkit-details-marker { display: none; }
.rq-fold > summary:focus-visible { outline: 2px solid #1b3a3d; outline-offset: 2px; }
.rq-fold__t { font-weight: 700; color: #1b3a3d; }
.rq-fold__t small { font-weight: 500; color: #5b5b62; }
.rq-fold__s { grid-column: 1; font-size: 13px; color: #5b5b62; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rq-fold__i { grid-column: 2; grid-row: 1 / span 2; width: 28px; height: 28px; border-radius: 50%; background: #e7efee; position: relative; }
.rq-fold__i::before { content: ''; position: absolute; left: 50%; top: 45%; width: 8px; height: 8px; border-right: 2px solid #1b3a3d; border-bottom: 2px solid #1b3a3d; transform: translate(-50%, -50%) rotate(45deg); transition: transform .2s; }
.rq-fold[open] .rq-fold__i::before { transform: translate(-50%, -20%) rotate(-135deg); }
.rq-fold__in { padding: 4px 16px 16px; }
.rq-fold__in > .m-field:last-child { margin-bottom: 0; }
@media (prefers-reduced-motion: reduce) { .rq-fold__i::before { transition: none; } }
.rq-fold__in > * + * { margin-top: 18px; }
