/* 24시법률상담센터 (24시법률상담센터.kr): 긴급 상담형(layout: 'urgent')의 두 번째 얼굴. 먹색 바탕 + 크림슨 한 가지, 첫 화면 오른쪽에 큰 '24'.
   분야는 타일이 아니라 번호 붙은 줄 목록. 긴급법률상담센터(look-urgent.css, 남청+주황 타일)와 같은 마크업을 다르게 보이게 한다. */
@import url('look-urgent.css');
html:root {
  --baize: #1a1625;
  --baize-deep: #110e19;
  --baize-text: #f5f3f7;
  --baize-muted: #b6afc3;
  --ink: #18151f;
  --muted: #625b6e;
  --line: #e7e3ec;
  --sage: #f6f4f8;
  --link: #1a1625;
  --seal: #e11d48;
  --r: 8px;
}
.ug-strip { background: #000; color: #d7d1e0; }
.top .call-apply, .btn, .ug-call { background: var(--seal); }
.top .call-apply:hover, .btn:hover, .ug-call:hover { background: #be123c; }

/* 첫 화면: 왼쪽 글, 오른쪽 큰 24 */
.ug-hero { background: linear-gradient(115deg, #110e19 0%, #1a1625 55%, #2a1020 100%); }
.ug-hero .wrap { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: clamp(20px, 5vw, 64px); }
.ug-hero .wrap > * { grid-column: 1; }
.ug-hero .wrap::after { content: '24'; grid-column: 2; grid-row: 1 / span 4; font: 900 clamp(120px, 20vw, 260px)/.8 var(--display); letter-spacing: -.08em; color: transparent; -webkit-text-stroke: 2px rgba(225, 29, 72, .75); text-shadow: 0 0 60px rgba(225, 29, 72, .25); }
.ug-live { justify-self: start; border-color: rgba(225, 29, 72, .45); color: #fecdd6; }
.ug-live span { background: var(--seal); }
.ug-hero h1 { font-weight: 900; }
.ug-call, .ug-apply { border-radius: var(--r); }

/* 분야: 번호 붙은 줄 목록 */
.ug-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; counter-reset: f; }
.ug-tile { counter-increment: f; flex-direction: row; align-items: baseline; gap: 14px; min-height: 0; padding: 16px 4px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; }
.ug-tile::before { content: counter(f, decimal-leading-zero); flex: none; color: var(--seal); font-weight: 800; font-size: 15px; font-variant-numeric: tabular-nums; }
.ug-tile strong { flex: none; min-width: 6.5em; }
.ug-tile strong::after { content: ''; }
.ug-tile:hover { box-shadow: none; transform: none; background: var(--sage); }
.ug-lists { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* 글 */
.now3 { background: #fff1f3; box-shadow: inset 4px 0 0 var(--seal); border-radius: var(--r); }
.now3-h, .now3 li::before { }
.now3 li::before { background: var(--seal); border-radius: 4px; }
.tw th { background: var(--baize); }
.cta { background: var(--baize-deep); }
.case-cta { background: #fff1f3; }
.foot { background: #0b0910; }
.lp-hero, .lp-promo, .lp-trust { background: #110e19; }
.lp-hero .kw, .lp-live b, .lp-hero h1 em { color: #fda4b4; }

@media (max-width: 900px) { .ug-lists { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) {
  .ug-hero .wrap { grid-template-columns: minmax(0, 1fr); }
  .ug-hero .wrap::after { grid-column: 1; grid-row: auto; order: -1; font-size: 96px; margin-bottom: 4px; }
  .ug-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) { .ug-lists { grid-template-columns: minmax(0, 1fr); } .ug-tile { flex-wrap: wrap; } .ug-tile span { flex-basis: 100%; padding-left: 34px; } }
