/* demo.dicolab.co.kr 갤러리 — demo-gallery.php 가 storage/app/demo-gallery/_gallery/gallery.css 로 복사한다.
   검색엔진이 읽는 목록이 목적이라 효과(움직임·호버·그림자·그라데이션) 없이 읽기 좋은 최소한만 둔다. */
:root { --ink: #172b3a; --muted: #607383; --teal: #087f78; --line: #dce7e9; --bg: #ffffff; }
@media (prefers-color-scheme: dark) {
  :root { --ink: #e6eef2; --muted: #9fb0bb; --teal: #3dbfb3; --line: #2c3d47; --bg: #16232b; }
}
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
  font-size: 16px;
  line-height: 1.7;
  word-break: keep-all;
  overflow-wrap: anywhere;
  overflow-x: clip;
}
a { color: var(--teal); }
img { display: block; width: 100%; height: auto; border: 1px solid var(--line); }
.wrap { width: min(1200px, 100% - 32px); margin-inline: auto; }
.top { padding: 16px 0; border-bottom: 1px solid var(--line); font-size: 15px; }
.top p { margin: 0; }
h1 { margin: 32px 0 8px; font-size: 30px; line-height: 1.3; }
.lead { margin: 0; color: var(--muted); }
.cats { display: flex; flex-wrap: wrap; gap: 6px 18px; list-style: none; margin: 20px 0 28px; padding: 0; }
.cats a[aria-current="page"] { color: var(--ink); font-weight: 700; text-decoration: none; }
.grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px 28px; }
.card h2 { margin: 12px 0 6px; font-size: 18px; line-height: 1.45; }
.card h2 a { color: var(--ink); }
.card p { margin: 0 0 6px; font-size: 15px; }
.card__shot { margin: 0 !important; }
.card__links { color: var(--muted); font-size: 14px !important; }
.ask { margin: 48px 0 0; padding-top: 24px; border-top: 1px solid var(--line); }
.ask h2 { margin: 0 0 6px; font-size: 20px; }
.foot { margin-top: 32px; padding: 20px 0 32px; border-top: 1px solid var(--line); color: var(--muted); font-size: 14px; }
.foot p { margin: 4px 0; }
.foot .biz { font-size: 13px; }
@media (max-width: 1024px) { .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .grid { grid-template-columns: 1fr; } h1 { font-size: 24px; } }
