/* ===== assist.css — AI 사전 검토 위젯(index·services) + JS 없이도 보이는 정적 요약표(index) =====
   base.css / works.css 는 수정하지 않는다(렌더 회귀 방지). 색·간격은 base.css 토큰만 사용한다.
   --accent 는 배경·보더 전용(텍스트 금지). 오류 텍스트는 contact-form.js 와 같은 #B3261E. */

/* 표 캡션 등 화면에는 숨기고 보조기기에만 읽히는 텍스트 (base.css 에 없어 여기서 정의) */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* ---- 입력 카드 ---- */
.assist{
  display:block; max-width:860px; margin:0 auto;
  background:linear-gradient(158deg, rgba(255,255,255,.94) 0%, rgba(238,246,250,.84) 100%);
  border:1px solid rgba(255,255,255,.7); border-radius:16px;
  padding:var(--sp-4); box-shadow:0 12px 28px -18px rgba(4,94,120,.24);
  word-break:keep-all; overflow-wrap:anywhere;
}
.assist-top{ display:flex; align-items:center; gap:.8rem; margin-bottom:var(--sp-2); }
.assist-chip{
  width:38px; height:38px; flex:none; border-radius:11px;
  background:linear-gradient(135deg, var(--brand), var(--accent)); color:var(--white);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 16px -6px rgba(4,94,120,.45);
}
.assist-chip svg{ width:20px; height:20px; flex:none; }
.assist-label{ display:block; font-size:1rem; font-weight:700; color:var(--ink); min-width:0; }
.assist textarea{
  display:block; width:100%; max-width:100%; min-height:112px; resize:vertical;
  padding:.9rem 1rem; border:1px solid var(--line); border-radius:var(--radius-sm);
  background:var(--white); color:var(--ink);
  font:inherit; font-size:1rem; line-height:1.7;   /* iOS 자동확대 방지: 16px 이상 유지 */
  word-break:keep-all; overflow-wrap:anywhere;
}
.assist textarea::placeholder{ color:var(--sub); opacity:.85; }
.assist textarea:disabled{ background:var(--paper-alt); color:var(--sub); }
.assist-meta{
  display:flex; flex-direction:column; gap:.35rem;
  margin-top:.7rem; font-size:var(--fs-2xs); color:var(--sub); line-height:1.6;
}
.assist-count b{ color:var(--brand); font-weight:700; }
.assist-actions{ display:flex; flex-direction:column; gap:.7rem; margin-top:var(--sp-3); }
.assist-actions .btn{ width:100%; min-height:48px; justify-content:center; }
.assist-actions .btn[disabled]{ opacity:.62; cursor:progress; }
/* 허니팟 — display:none 은 일부 봇이 무시하므로 화면 밖으로 밀어낸다 */
.assist-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* ---- 결과 영역 ---- */
.assist-out{ max-width:860px; margin:var(--sp-3) auto 0; }
.assist-out[hidden]{ display:none; }
.assist-card{
  background:var(--white); border:1px solid var(--line); border-left:3px solid var(--accent);
  border-radius:var(--radius-md); padding:var(--sp-4);
  box-shadow:0 14px 34px -20px rgba(4,94,120,.28);
  word-break:keep-all; overflow-wrap:anywhere;
}
/* 결과 카드는 스크린리더 위치 유지를 위해 프로그램적으로 포커스한다.
   :focus 대신 :focus-visible 을 써서 마우스 사용자에게는 링이 남지 않게 한다. */
.assist-card:focus{ outline:none; }
.assist-card:focus-visible{ outline:2px solid var(--brand); outline-offset:3px; }
.assist-badge{
  display:inline-block; padding:.3rem .7rem; border-radius:999px;
  background:var(--accent-tint); color:var(--brand);
  font-size:var(--fs-2xs); font-weight:700; letter-spacing:.03em;
}
.assist-card h3{ font-size:var(--fs-h3); color:var(--ink); margin:.8rem 0 var(--sp-2); }
.assist-lines{ display:grid; gap:.6rem; margin:0 0 var(--sp-3); }
.assist-lines li{
  position:relative; padding-left:1.15rem; font-size:.95rem; line-height:1.7; color:var(--ink);
}
.assist-lines li::before{
  content:""; position:absolute; left:0; top:.62em;
  width:6px; height:6px; border-radius:50%; background:var(--accent);
}
.assist-facts{
  display:grid; gap:.8rem; margin:0 0 var(--sp-2);
  padding:var(--sp-2) 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.assist-facts dt{ font-size:var(--fs-2xs); letter-spacing:.06em; color:var(--sub); font-weight:600; }
.assist-facts dd{ margin:.15rem 0 0; font-size:1.05rem; font-weight:700; color:var(--brand); }
.assist-caveat{ font-size:var(--fs-2xs); color:var(--sub); line-height:1.6; margin-bottom:var(--sp-3); }
.assist-caveat:empty{ display:none; }
.assist-cta{ display:flex; flex-direction:column; gap:.7rem; }
.assist-cta .btn{ width:100%; min-height:48px; justify-content:center; }
.assist-reset{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; padding:.6rem 1.1rem;
  background:transparent; border:1px solid var(--line); border-radius:var(--radius-sm);
  font:inherit; font-size:.9rem; color:var(--sub);
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.assist-reset:hover{ color:var(--brand); border-color:var(--brand); }
.assist-src{ margin-top:var(--sp-2); font-size:.8rem; color:var(--sub); line-height:1.6; }

/* ---- 로딩 · 안내 · 오류 ---- */
.assist-loading{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md);
  padding:var(--sp-3); box-shadow:0 14px 34px -20px rgba(4,94,120,.18);
}
.assist-loading p{ font-size:.9rem; color:var(--sub); margin-bottom:.9rem; }
.assist-loading b{ color:var(--brand); font-weight:700; }
.assist-skel{ display:grid; gap:.6rem; }
.assist-skel span{
  display:block; height:12px; border-radius:6px;
  background:linear-gradient(90deg, var(--paper-alt) 0%, #E4F3F6 50%, var(--paper-alt) 100%);
  background-size:200% 100%; animation:assistPulse 1.6s var(--ease) infinite;
}
.assist-skel span:nth-child(2){ width:88%; }
.assist-skel span:nth-child(3){ width:64%; }
@keyframes assistPulse{ 0%{ background-position:120% 0; } 100%{ background-position:-20% 0; } }
@media (prefers-reduced-motion: reduce){
  .assist-skel span{ animation:none; background:var(--paper-alt); }
}
.assist-note{
  background:var(--white); border:1px solid var(--line); border-left:3px solid var(--accent);
  border-radius:var(--radius-md); padding:var(--sp-3); color:var(--ink);
  font-size:.95rem; line-height:1.7; word-break:keep-all; overflow-wrap:anywhere;
}
.assist-note.is-error{ border-left-color:#B3261E; color:#B3261E; background:var(--white); }
.assist-note .assist-links{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.9rem; }
.assist-note .assist-links a{
  display:inline-flex; align-items:center; min-height:44px; padding:.5rem 1rem;
  border:1px solid var(--line); border-radius:var(--radius-sm);
  background:var(--white); color:var(--brand); font-size:.9rem; font-weight:600; text-decoration:none;
}
.assist-note .assist-links a:hover{ border-color:var(--brand); }

/* ---- JS 없이도 보이는 정적 요약 (index 진단 섹션) ---- */
.fit-static{
  max-width:860px; margin:0 auto var(--sp-3);
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md);
  padding:var(--sp-2) var(--sp-3);
}
.fit-static > summary{
  cursor:pointer; min-height:44px; display:flex; align-items:center;
  font-size:.95rem; font-weight:700; color:var(--brand); list-style:none;
}
.fit-static > summary::-webkit-details-marker{ display:none; }
.fit-static > summary::after{ content:"＋"; margin-left:auto; color:var(--sub); font-weight:600; }
.fit-static[open] > summary::after{ content:"－"; }
.fit-static > summary:focus-visible{ outline:2px solid var(--brand); outline-offset:3px; }
.fit-static .cmp-scroll{ margin-top:var(--sp-2); }
.fit-static .cmp th, .fit-static .cmp td{ word-break:keep-all; overflow-wrap:anywhere; }
.fit-static-note{ margin-top:.8rem; font-size:var(--fs-2xs); color:var(--sub); line-height:1.6; }

/* ---- 반응형: 768px 이상에서 가로 배치로 전환 ---- */
@media (min-width:768px){
  .assist-meta{ flex-direction:row; align-items:baseline; justify-content:space-between; gap:var(--sp-2); }
  .assist-actions{ flex-direction:row; align-items:center; }
  .assist-actions .btn{ width:auto; }
  .assist-facts{ grid-template-columns:1fr 1fr; gap:var(--sp-3); }
  .assist-cta{ flex-direction:row; align-items:center; flex-wrap:wrap; }
  .assist-cta .btn{ width:auto; }
  .assist-lines li{ font-size:1rem; }
}