/* =================================================================
   LawMate — Common Stylesheet
   토큰: ink(잉크블랙) / paper(페이퍼) / line(구분선) / ash(보조텍스트)
        + accent(도메인별 포인트컬러, body 인라인 스타일로 주입됨)
   ================================================================= */

:root{
  --ink: #0E1013;
  --ink-soft: #16181C;
  --ink-elev: #1D2025;
  --paper: #F7F6F3;
  --paper-elev: #FFFFFF;
  --line-dark: #262A30;
  --line-light: #E4E2DC;
  --ash: #8B8E94;
  --ash-dark: #6E7177;
  --text-on-paper: #14151A;
  --text-on-ink: #F3F2EF;

  --accent: #4453E8;       /* theme.php 에서 body 인라인 style 로 override */
  --accent-soft: #EBEDFC;  /* 〃 */

  --font-display: 'Noto Serif KR', 'Georgia', serif;
  --font-body: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Malgun Gothic', sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;

  --header-h: 72px;
  --radius: 14px;
  --container-w: 1160px;

  --ease: cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *,*::before,*::after{ animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

body{
  margin:0;
  font-family: var(--font-body);
  background: var(--paper);
  color: var(--text-on-paper);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
ul{ list-style:none; margin:0; padding:0; }
button{ font-family: inherit; }

:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: 4px;
}

.container{
  width:100%;
  max-width: var(--container-w);
  margin: 0 auto;
  padding: 0 24px;
}

/* ---------------------------------------------------------------
   Header / Nav
   --------------------------------------------------------------- */
.site-header{
  position: sticky;
  top:0;
  z-index: 100;
  height: var(--header-h);
  background: rgba(247,246,243,0.86);
  backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid var(--line-light);
  transition: box-shadow .25s var(--ease), background .25s var(--ease), height .25s var(--ease);
}
.site-header.is-scrolled{
  background: rgba(247,246,243,0.96);
  box-shadow: 0 8px 24px -12px rgba(0,0,0,0.18);
}

/* 스크롤 진행률 바 */
.scroll-progress{
  position: fixed;
  top: 0; left: 0;
  height: 3px;
  width: 0%;
  background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 40%, #fff));
  z-index: 4000;
  transition: width .1s linear;
}
.site-header__inner{
  height:100%;
  display:flex;
  align-items:center;
  gap: 32px;
}
.brand{
  display:flex; align-items:center; gap:8px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.15rem;
  color: var(--text-on-paper);
  white-space: nowrap;
}
.brand__mark{
  display:inline-flex; align-items:center; justify-content:center;
  width: 30px; height:30px;
  border-radius: 8px;
  background: var(--accent);
  color:#fff;
  font-family: var(--font-mono);
  font-weight:600;
  font-size: 1rem;
}
.main-nav{ flex:1; }
.main-nav ul{ display:flex; gap:28px; }
.main-nav a{
  font-size: .93rem;
  color: var(--ash-dark);
  padding: 6px 2px;
  border-bottom: 2px solid transparent;
  transition: color .18s var(--ease), border-color .18s var(--ease);
}
.main-nav a:hover, .main-nav a.is-active{
  color: var(--text-on-paper);
  border-bottom-color: var(--accent);
}
.site-header__actions{ display:flex; align-items:center; gap:10px; flex-shrink:0; }

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 10px 18px;
  border-radius: 999px;
  font-size: .9rem;
  font-weight: 600;
  transition: transform .16s var(--ease), background .16s var(--ease), color .16s var(--ease), box-shadow .16s var(--ease);
  white-space:nowrap;
}
.btn--ghost{ color: var(--text-on-paper); }
.btn--ghost:hover{ background: var(--line-light); }
.btn--accent{ background: var(--accent); color:#fff; box-shadow: 0 6px 16px -6px color-mix(in srgb, var(--accent) 60%, transparent); }
.btn--accent:hover{ transform: translateY(-1px); }
.btn--outline{ border:1.5px solid var(--line-dark); color:#fff; }
.btn--outline:hover{ background: rgba(255,255,255,.08); }
.btn--block{ width:100%; }
.btn--lg{ padding: 14px 26px; font-size: .98rem; }

/* Hamburger (mobile only) */
.hamburger{
  display:none;
  width: 40px; height:40px;
  border:none; background:transparent;
  flex-direction:column; justify-content:center; align-items:center; gap:5px;
  cursor:pointer;
}
.hamburger span{
  width: 20px; height:2px; background: var(--text-on-paper); border-radius:2px;
  transition: transform .25s var(--ease), opacity .2s var(--ease);
}
.hamburger[aria-expanded="true"] span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.hamburger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.hamburger[aria-expanded="true"] span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

/* Mobile fullscreen menu (app style) */
.mobile-menu{
  position: fixed; inset:0;
  background: var(--ink);
  color: var(--text-on-ink);
  z-index: 200;
  display:flex; flex-direction:column; justify-content:center;
  padding: 32px 28px;
  transform: translateX(100%);
  transition: transform .32s var(--ease);
}
.mobile-menu.is-open{ transform: translateX(0); }
.mobile-menu ul{ display:flex; flex-direction:column; gap:6px; margin-bottom: 32px; }
.mobile-menu a{ font-family: var(--font-display); font-size: 1.6rem; padding: 12px 0; border-bottom: 1px solid var(--line-dark); }
.mobile-menu__actions{ display:flex; flex-direction:column; gap:10px; }

/* ---------------------------------------------------------------
   Section shells
   --------------------------------------------------------------- */
.section{ padding: 96px 0; }
.section--tight{ padding: 64px 0; }
.section--ink{ background: var(--ink); color: var(--text-on-ink); }
.section--elev{ background: var(--paper-elev); }

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family: var(--font-mono);
  font-size: .78rem;
  letter-spacing: .06em;
  color: var(--accent);
  margin-bottom: 18px;
}
.eyebrow::before{ content:''; width:16px; height:1px; background: currentColor; }

h1,h2,h3{ font-family: var(--font-display); font-weight:700; margin:0 0 .5em; line-height:1.25; }
.section h2{ font-size: clamp(1.6rem, 2.6vw, 2.35rem); }
p{ margin: 0 0 1em; }
.lede{ font-size: 1.08rem; color: var(--ash-dark); max-width: 620px; }
.section--ink .lede{ color: #B9BAC0; }

/* ---------------------------------------------------------------
   Hero
   --------------------------------------------------------------- */
.hero{
  background: var(--ink);
  color: var(--text-on-ink);
  padding: 88px 0 0;
  position: relative;
  overflow: hidden;
}
.hero::before{
  content:"";
  position:absolute;
  top:-220px; right:-160px;
  width:560px; height:560px;
  background: radial-gradient(circle, var(--accent) 0%, transparent 70%);
  opacity:.16;
  filter: blur(50px);
  animation: heroFloat 12s ease-in-out infinite;
  pointer-events:none;
}
@keyframes heroFloat{
  0%,100%{ transform: translate(0,0) scale(1); }
  50%{ transform: translate(-40px, 40px) scale(1.1); }
}
.hero > .container, .hero .split-entry{ position: relative; z-index: 1; }
.hero__top{ max-width: 760px; margin-bottom: 56px; }
.hero__top .eyebrow{ color: var(--accent); }
.hero h1{ font-size: clamp(2.1rem, 4.6vw, 3.4rem); letter-spacing:-0.01em; }
.hero h1 em{ font-style:normal; color: var(--accent); }
.hero__sub{ color:#B9BAC0; font-size:1.08rem; max-width: 560px; margin-bottom: 32px; }
.hero__actions{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom: 64px; }

/* Split entry — 두 사이드(의뢰인/파트너) 를 실제 사이트 컬러 그대로 보여주는 시그니처 요소 */
.split-entry{
  border-top: 1px solid var(--line-dark);
}
.split-entry__inner{
  display:grid;
  grid-template-columns: 1fr 1fr;
  padding-top: 56px;
  padding-bottom: 56px;
}
.split-entry__card{
  padding: 8px clamp(24px,4vw,56px);
  position:relative;
}
.split-entry__card:first-child{ padding-left: 0; }
.split-entry__card:last-child{ padding-right: 0; }
.split-entry__card + .split-entry__card{ border-left: 1px solid var(--line-dark); }
.split-entry__card[data-side="client"]{ --side-accent: #2F6FED; }
.split-entry__card[data-side="partner"]{ --side-accent: #C08A3E; }
.split-entry__tag{
  font-family: var(--font-mono); font-size:.78rem; letter-spacing:.06em;
  color: var(--side-accent);
  margin-bottom: 14px; display:block;
}
.split-entry__card h3{ font-size: 1.4rem; color:#fff; }
.split-entry__card p{ color:#B9BAC0; font-size:.95rem; max-width: 420px; }
.split-entry__card .btn{ margin-top: 18px; background: var(--side-accent); color:#0E1013; font-weight:700; }
.split-entry__card .btn:hover{ transform: translateY(-1px); }
.split-entry__card:nth-child(1){ transition-delay: .05s; }
.split-entry__card:nth-child(2){ transition-delay: .18s; }

/* ---------------------------------------------------------------
   조문식 리스트 (작동 방식) — 카드 그리드 대신 법률 조항 형식
   --------------------------------------------------------------- */
.clause-list{ border-top: 1px solid var(--line-light); margin-top: 40px; }
.clause{
  display:grid;
  grid-template-columns: 120px 1fr;
  gap: 28px;
  padding: 34px 0;
  border-bottom: 1px solid var(--line-light);
  border-left: 3px solid transparent;
  padding-left: 16px;
  margin-left: -16px;
  transition: border-color .3s var(--ease), background .3s var(--ease), transform .3s var(--ease);
}
.clause:hover, .clause.is-active{
  border-left-color: var(--accent);
  background: var(--accent-soft);
  transform: translateX(4px);
}
.clause__num{
  font-family: var(--font-mono);
  font-size: .85rem;
  color: var(--accent);
  padding-top: 4px;
  transition: transform .3s var(--ease);
}
.clause:hover .clause__num, .clause.is-active .clause__num{ transform: scale(1.12); }
.clause h3{ font-size: 1.15rem; margin-bottom: 8px; }
.clause p{ color: var(--ash-dark); margin:0; max-width: 560px; }
.clause-list .clause:nth-child(1){ transition-delay: .02s; }
.clause-list .clause:nth-child(2){ transition-delay: .06s; }
.clause-list .clause:nth-child(3){ transition-delay: .10s; }
.clause-list .clause:nth-child(4){ transition-delay: .14s; }
.clause-list .clause:nth-child(5){ transition-delay: .18s; }
.clause-list .clause:nth-child(6){ transition-delay: .22s; }
.clause-list .clause:nth-child(7){ transition-delay: .26s; }
.clause-list .clause:nth-child(8){ transition-delay: .30s; }
.clause-list .clause:nth-child(9){ transition-delay: .34s; }
.clause-list .clause:nth-child(10){ transition-delay: .38s; }
.clause-list .clause:nth-child(11){ transition-delay: .42s; }
.clause-list .clause:hover{ transition-delay: 0s !important; }

/* ---------------------------------------------------------------
   Stats strip
   --------------------------------------------------------------- */
.stats{
  display:grid;
  grid-template-columns: repeat(4,1fr);
  gap: 24px;
  border-top: 1px solid var(--line-dark);
  padding-top: 40px;
}
.stat__num{ font-family: var(--font-mono); font-size: clamp(1.5rem,3vw,2.2rem); color:#fff; font-weight:600; }
.stat__label{ color:#8B8E94; font-size:.85rem; margin-top:6px; }

/* ---------------------------------------------------------------
   Practice-area tags
   --------------------------------------------------------------- */
.tag-grid{ display:flex; flex-wrap:wrap; gap:12px; margin-top: 32px; }
.tag-grid a{
  padding: 12px 20px;
  border: 1px solid var(--line-light);
  border-radius: 999px;
  font-size: .92rem;
  background: var(--paper-elev);
  transition: border-color .18s var(--ease), color .18s var(--ease), background .18s var(--ease);
}
.tag-grid a:hover{ border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }

/* ---------------------------------------------------------------
   Trust / fee band
   --------------------------------------------------------------- */
.trust-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap: 28px; margin-top: 36px; }
.trust-card{
  padding: 28px;
  background: var(--paper-elev);
  border: 1px solid var(--line-light);
  border-radius: var(--radius);
}
.trust-card__icon{ width:36px; height:36px; margin-bottom:16px; color: var(--accent); }
.trust-card h3{ font-size: 1.05rem; margin-bottom:8px; }
.trust-card p{ color: var(--ash-dark); font-size:.92rem; margin:0; }

/* ---------------------------------------------------------------
   Final CTA band
   --------------------------------------------------------------- */
.cta-band{
  background: var(--ink);
  color:#fff;
  text-align:center;
  padding: 80px 24px;
}
.cta-band h2{ font-size: clamp(1.6rem,3.4vw,2.4rem); max-width:640px; margin: 0 auto 14px; }
.cta-band p{ color:#B9BAC0; margin-bottom: 30px; }
.cta-band__actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* ---------------------------------------------------------------
   Footer
   --------------------------------------------------------------- */
.site-footer{ background: var(--ink); color:#B9BAC0; }
.site-footer__inner{
  display:flex; justify-content:space-between; gap:48px;
  padding: 64px 24px 40px;
  flex-wrap:wrap;
}
.site-footer__brand{ max-width: 280px; }
.site-footer__brand .brand__name{ color:#fff; font-family: var(--font-display); font-weight:700; }
.site-footer__brand p{ font-size:.88rem; margin-top:10px; }
.site-footer__links{ display:flex; gap:56px; flex-wrap:wrap; }
.site-footer__links h4{ color:#fff; font-size:.85rem; margin:0 0 14px; letter-spacing:.03em; }
.site-footer__links ul{ display:flex; flex-direction:column; gap:9px; }
.site-footer__links a{ font-size:.88rem; color:#9A9CA3; }
.site-footer__links a:hover{ color:#fff; }
.site-footer__legal{
  border-top: 1px solid var(--line-dark);
  padding: 24px 24px 40px;
  font-size: .78rem;
  color:#6E7177;
}
.site-footer__legal p{ margin:0 0 8px; }
.site-footer__copyright{ color:#8B8E94; }

/* ---------------------------------------------------------------
   App bottom tabbar (mobile only, client/partner 내부 페이지용)
   --------------------------------------------------------------- */
.app-tabbar{
  display:none;
  position: fixed; left:0; right:0; bottom:0; z-index:150;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px) saturate(160%);
  border-top: 1px solid var(--line-light);
  padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
  justify-content: space-around;
}
.app-tabbar__item{
  display:flex; flex-direction:column; align-items:center; gap:4px;
  font-size:.68rem; color: var(--ash-dark);
  padding: 6px 10px;
  flex:1;
}
.app-tabbar__item svg{ stroke: currentColor; }
.app-tabbar__item.is-active{ color: var(--accent); }

/* ---------------------------------------------------------------
   Scroll reveal
   --------------------------------------------------------------- */
[data-reveal]{
  opacity:0;
  transform: translateY(18px);
  transition: opacity .6s var(--ease), transform .6s var(--ease);
}
[data-reveal].is-revealed{ opacity:1; transform:none; }

/* =================================================================
   App / Dashboard components (가입·로그인·대시보드·사건관리 공통)
   ================================================================= */

/* 인증 화면(가입/로그인) 가운데 정렬 카드 */
.auth-shell{
  min-height: calc(100vh - var(--header-h));
  display:flex; align-items:center; justify-content:center;
  padding: 48px 20px;
  background: var(--paper);
}
.auth-card{
  width:100%; max-width: 440px;
  background: var(--paper-elev);
  border: 1px solid var(--line-light);
  border-radius: var(--radius);
  padding: 40px clamp(24px,4vw,44px);
}
.auth-card h1{ font-size: 1.5rem; margin-bottom: 6px; }
.auth-card .lede{ font-size: .92rem; margin-bottom: 28px; }
.auth-card__footer{ margin-top: 22px; font-size:.88rem; color: var(--ash-dark); text-align:center; }
.auth-card__footer a{ color: var(--accent); font-weight:600; }

/* 폼 */
.form-group{ margin-bottom: 20px; }
.form-row{ display:grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-label{ display:block; font-size:.86rem; font-weight:600; margin-bottom:7px; }
.form-hint{ font-size:.78rem; color: var(--ash-dark); margin-top:6px; }
.form-error{ font-size:.78rem; color:#C4443A; margin-top:6px; }
.form-input, .form-textarea, .form-select{
  width:100%;
  padding: 12px 14px;
  border: 1.5px solid var(--line-light);
  border-radius: 10px;
  background: var(--paper-elev);
  font-family: var(--font-body);
  font-size: .95rem;
  color: var(--text-on-paper);
  transition: border-color .16s var(--ease), box-shadow .16s var(--ease);
}
.form-textarea{ resize: vertical; min-height: 120px; }
.form-input:focus, .form-textarea:focus, .form-select:focus{
  outline:none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft);
}
.form-check{ display:flex; align-items:flex-start; gap:9px; font-size:.86rem; color: var(--ash-dark); }
.form-check input{ margin-top:3px; accent-color: var(--accent); }
.form-submit{ margin-top: 8px; }

.alert{
  padding: 13px 16px;
  border-radius: 10px;
  font-size:.88rem;
  margin-bottom: 20px;
  border: 1px solid transparent;
}
.alert--error{ background:#FCEEEC; color:#B23A2F; border-color:#F3D2CC; }
.alert--success{ background: var(--accent-soft); color: var(--accent); border-color: var(--accent-soft); }

/* 로그인 후 내부 페이지 상단 보조 네비게이션 */
.local-nav{
  background: var(--paper-elev);
  border-bottom: 1px solid var(--line-light);
}
.local-nav__inner{ display:flex; align-items:center; gap:4px; overflow-x:auto; }
.local-nav a{
  padding: 15px 4px;
  margin-right: 26px;
  font-size:.9rem;
  color: var(--ash-dark);
  border-bottom: 2px solid transparent;
  white-space:nowrap;
}
.local-nav a:hover, .local-nav a.is-active{ color: var(--text-on-paper); border-color: var(--accent); }

.page-head{ padding: 40px 0 8px; }
.page-head__row{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.page-head h1{ font-size: 1.7rem; margin-bottom:6px; }
.page-head .lede{ margin-bottom:0; }

/* 대시보드 통계 카드 */
.dashboard-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:16px; margin: 28px 0 40px; }
.stat-card{
  background: var(--paper-elev);
  border: 1px solid var(--line-light);
  border-radius: var(--radius);
  padding: 22px;
}
.stat-card__label{ font-size:.82rem; color: var(--ash-dark); margin-bottom:10px; }
.stat-card__num{ font-family: var(--font-mono); font-size:1.6rem; font-weight:600; }
.stat-card__num small{ font-size:.9rem; color: var(--ash-dark); font-weight:500; }

/* 사건 카드 / 리스트 */
.case-list{ display:flex; flex-direction:column; gap:12px; }
.case-card{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  background: var(--paper-elev);
  border: 1px solid var(--line-light);
  border-radius: var(--radius);
  padding: 20px 22px;
  transition: border-color .16s var(--ease), transform .16s var(--ease);
}
.case-card:hover{ border-color: var(--accent); transform: translateY(-1px); }
.case-card__main{ min-width:0; }
.case-card__title{ font-size:1.02rem; font-weight:700; margin-bottom:6px; }
.case-card__meta{ font-size:.82rem; color: var(--ash-dark); display:flex; gap:10px; flex-wrap:wrap; }
.case-card__side{ display:flex; align-items:center; gap:14px; flex-shrink:0; }
.case-card__bids{ font-family: var(--font-mono); font-size:.85rem; color: var(--ash-dark); }

.empty-state{
  text-align:center;
  padding: 64px 24px;
  border: 1.5px dashed var(--line-light);
  border-radius: var(--radius);
  color: var(--ash-dark);
}
.empty-state h3{ color: var(--text-on-paper); margin-bottom:8px; }

/* 상태 배지 */
.badge{
  display:inline-flex; align-items:center; gap:6px;
  font-family: var(--font-mono);
  font-size:.72rem;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--line-light);
  color: var(--ash-dark);
  white-space:nowrap;
}
.badge::before{ content:''; width:6px; height:6px; border-radius:50%; background:currentColor; }
.badge--recruiting{ background:#EAF1FE; color:#2F6FED; }
.badge--matched{ background:#FBF2E4; color:#C08A3E; }
.badge--in_progress{ background: var(--accent-soft); color: var(--accent); }
.badge--completed{ background:#E7F6EE; color:#1E9E5A; }
.badge--cancelled, .badge--rejected, .badge--withdrawn{ background:#F1F1F0; color:#8B8E94; }
.badge--submitted{ background:#EAF1FE; color:#2F6FED; }
.badge--shortlisted{ background:#FBF2E4; color:#C08A3E; }
.badge--accepted, .badge--signed, .badge--paid{ background:#E7F6EE; color:#1E9E5A; }
.badge--draft, .badge--pending, .badge--pending_signature{ background:#F1F1F0; color:#6E7177; }

/* 상세 페이지 레이아웃 */
.detail-grid{ display:grid; grid-template-columns: 1fr 300px; gap: 32px; align-items:start; margin-top: 24px; }
.detail-card{
  background: var(--paper-elev);
  border: 1px solid var(--line-light);
  border-radius: var(--radius);
  padding: 26px;
  margin-bottom: 20px;
}
.detail-card h3{ font-size:1rem; margin-bottom:14px; }
.kv-list{ display:flex; flex-direction:column; gap:10px; font-size:.9rem; }
.kv-list__row{ display:flex; justify-content:space-between; gap:12px; }
.kv-list__row dt{ color: var(--ash-dark); }
.kv-list__row dd{ margin:0; font-weight:600; text-align:right; }

/* 탭 */
.tabs{ display:flex; gap:4px; border-bottom:1px solid var(--line-light); margin-bottom:24px; overflow-x:auto; }
.tab-btn{
  padding: 11px 4px; margin-right:24px;
  font-size:.92rem; color: var(--ash-dark);
  border-bottom:2px solid transparent;
  background:none; border-top:none; border-left:none; border-right:none;
  cursor:pointer; white-space:nowrap;
}
.tab-btn.is-active{ color: var(--text-on-paper); border-color: var(--accent); font-weight:600; }
.tab-panel{ display:none; }
.tab-panel.is-active{ display:block; }

/* 입찰(역경매) 리스트 */
.bid-card{
  border: 1px solid var(--line-light);
  border-radius: var(--radius);
  padding: 18px 20px;
  margin-bottom: 12px;
  display:flex; justify-content:space-between; gap:16px; align-items:flex-start; flex-wrap:wrap;
}
.bid-card__lawyer{ font-weight:700; margin-bottom:4px; }
.bid-card__fee{ font-family: var(--font-mono); color: var(--accent); font-weight:600; }
.bid-card__msg{ font-size:.88rem; color: var(--ash-dark); margin-top:8px; max-width:520px; }
.bid-card__actions{ display:flex; gap:8px; flex-shrink:0; }

/* 기일/메모 타임라인 (스크랩 공간) */
.timeline{ border-left: 2px solid var(--line-light); margin-left:6px; padding-left:24px; }
.timeline-item{ position:relative; padding-bottom:26px; }
.timeline-item::before{
  content:''; position:absolute; left:-30px; top:4px;
  width:10px; height:10px; border-radius:50%;
  background: var(--accent); border:2px solid var(--paper-elev);
}
.timeline-item__date{ font-family: var(--font-mono); font-size:.76rem; color: var(--ash-dark); margin-bottom:4px; }
.timeline-item__title{ font-weight:700; margin-bottom:4px; }
.timeline-item__body{ font-size:.88rem; color: var(--ash-dark); }
.timeline-item__source{ font-size:.78rem; margin-top:6px; }

/* 채팅 자리 (Node 채팅서버 연동 예정 — 지금은 자리만) */
.chat-placeholder{
  border: 1px solid var(--line-light);
  border-radius: var(--radius);
  overflow:hidden;
  display:flex; flex-direction:column;
  height: 420px;
  background: var(--paper-elev);
}
.chat-placeholder__header{
  padding: 14px 18px; border-bottom:1px solid var(--line-light);
  font-size:.88rem; font-weight:600; display:flex; justify-content:space-between; align-items:center;
}
.chat-placeholder__status{ font-family: var(--font-mono); font-size:.72rem; color: var(--ash-dark); }
.chat-placeholder__body{
  flex:1; display:flex; align-items:center; justify-content:center;
  color: var(--ash-dark); font-size:.86rem; text-align:center; padding: 24px;
}
.chat-placeholder__footer{ padding:12px; border-top:1px solid var(--line-light); display:flex; gap:8px; }
.chat-placeholder__footer input{ flex:1; }
.chat-placeholder__footer input:disabled{ background: var(--paper); color: var(--ash-dark); }

/* 심플 테이블 (계약/결제 등) */
.table{ width:100%; border-collapse:collapse; font-size:.9rem; }
.table th, .table td{ padding: 12px 10px; text-align:left; border-bottom:1px solid var(--line-light); }
.table th{ color: var(--ash-dark); font-weight:600; font-size:.8rem; }

/* ---------------------------------------------------------------
   Responsive
   --------------------------------------------------------------- */
@media (max-width: 1024px){
  .trust-grid{ grid-template-columns: 1fr 1fr; }
  .stats{ grid-template-columns: repeat(2,1fr); row-gap: 32px; }
  .dashboard-grid{ grid-template-columns: 1fr 1fr; }
  .detail-grid{ grid-template-columns: 1fr; }
}

@media (max-width: 860px){
  .main-nav, .site-header__actions{ display:none; }
  .hamburger{ display:flex; }
  .split-entry__inner{ grid-template-columns: 1fr; padding-top: 40px; padding-bottom: 8px; }
  .split-entry__card{ padding: 28px 0 !important; }
  .split-entry__card + .split-entry__card{ border-left:none; border-top:1px solid var(--line-dark); }
  .clause{ grid-template-columns: 1fr; gap:8px; }
  .trust-grid{ grid-template-columns: 1fr; }

  /* 모바일 = 앱 스타일: 하단 탭바가 있는 페이지는 콘텐츠 여백 확보 + 탭바 노출 */
  body:has(.app-tabbar){ padding-bottom: 64px; }
  .app-tabbar{ display:flex; }

  .form-row{ grid-template-columns: 1fr; }
  .dashboard-grid{ grid-template-columns: 1fr 1fr; gap:12px; }
  .case-card{ flex-direction:column; align-items:flex-start; }
  .case-card__side{ width:100%; justify-content:space-between; }
  .bid-card{ flex-direction:column; }
  .bid-card__actions{ width:100%; }
  .bid-card__actions .btn{ flex:1; }
}

@media (max-width: 520px){
  .section{ padding: 64px 0; }
  .hero{ padding-top: 56px; }
  .site-footer__inner{ padding: 48px 20px 32px; }
}

/* Partner banner grid (images/banner/*.jpg 자동 나열, 150px 고정 타일) */
.partner-banner {
  display: grid;
  grid-template-columns: repeat(auto-fill, 150px);
  gap: 20px;
  justify-content: center;
  margin-top: 40px;
}
.partner-banner__item {
  width: 150px;
  height: 90px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 12px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .3s ease, background .3s ease, box-shadow .3s ease;
}
.partner-banner__item:hover {
  transform: translateY(-6px);
  background: rgba(255,255,255,0.08);
  box-shadow: 0 12px 24px -10px rgba(0,0,0,0.4);
}
.partner-banner__item:nth-child(4n+1){ transition-delay: .02s; }
.partner-banner__item:nth-child(4n+2){ transition-delay: .08s; }
.partner-banner__item:nth-child(4n+3){ transition-delay: .14s; }
.partner-banner__item:nth-child(4n+4){ transition-delay: .20s; }
.partner-banner__item:hover{ transition-delay: 0s; }
.partner-banner__item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: grayscale(100%);
  opacity: .8;
  transition: filter .3s ease, opacity .3s ease;
}
.partner-banner__item:hover img {
  filter: grayscale(0%);
  opacity: 1;
}

/* 무료 상담 모달 - 가입/로그인 탭 */
.auth-tabs {
  display: flex;
  gap: 8px;
  border-bottom: 1px solid #f1f5f9;
}
.auth-tab {
  flex: 1;
  padding: 12px 0;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  font-size: 15px;
  font-weight: 700;
  color: #94a3b8;
  cursor: pointer;
}
.auth-tab.is-active {
  color: #0f172a;
  border-bottom-color: var(--accent, #4453E8);
}

/* 회원가입/로그인 모달 공통 스타일 (index.php auth-modal 등에서 사용) */
.hidden { display: none !important; }

.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  backdrop-filter: blur(15px);
  z-index: 3000;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
}
.modal-overlay.active {
  opacity: 1;
  pointer-events: auto;
}
.modal-card {
  background: #fff;
  width: min(480px, 92vw);
  max-height: 90vh;
  overflow-y: auto;
  border-radius: 32px;
  color: #1e293b;
  padding: 40px;
  box-sizing: border-box;
}
.modal-input {
  width: 100%;
  padding: 16px 18px;
  border: 2px solid #f1f5f9;
  border-radius: 16px;
  margin-top: 10px;
  background: #f8fafc;
  font-size: 15px;
  box-sizing: border-box;
}
.req-item {
  font-size: 13px;
  color: #cbd5e1;
  margin-top: 8px;
}
.req-item.valid {
  color: #10b981;
  font-weight: 700;
}
.btn-main {
  width: 100%;
  background: #0f172a;
  color: #fff;
  border: none;
  padding: 18px;
  border-radius: 16px;
  font-weight: 800;
  font-size: 15px;
  margin-top: 20px;
  cursor: pointer;
}
.btn-sub {
  width: 100%;
  background: #f1f5f9;
  color: #64748b;
  border: none;
  padding: 16px;
  border-radius: 16px;
  font-weight: 700;
  font-size: 14px;
  margin-top: 10px;
  cursor: pointer;
}