@import url('https://fonts.googleapis.com/css2?family=Hahmlet:wght@300;400;500;600;700&family=Gowun+Batang:wght@400;700&family=Gowun+Dodum&display=swap');

:root {
  --bg-paper: #F1EADB;
  --bg-card: #FBF8EF;
  --bg-slot: #EDE6D2;
  --text-strong: #40392C;
  --text-body: #514A3A;
  --text-sub: #6E6450;
  --text-caption: #A08A5F;
  --text-faint: #8A7E64;
  --accent-deep: #4C5A3E;
  --accent-light: #6B7F5A;
  --on-accent: #EFEADA;
  --on-accent-sub: #B9C49E;
  --border-solid: #DDD2B8;
  --border-dashed: #C7BCA0;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg-paper);
  font-family: 'Gowun Dodum', sans-serif;
  color: var(--text-strong);
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--accent-light); }

.page {
  max-width: 1200px;
  margin: 0 auto;
  background: var(--bg-paper);
}

/* Header */
.site-header {
  text-align: center;
  padding: 44px 40px 32px;
  border-bottom: 1px dashed var(--border-dashed);
}

.site-header .eyebrow {
  margin: 0 0 10px;
  font-size: 13px;
  letter-spacing: 0.3em;
  color: var(--text-caption);
}

.site-header .logo {
  font-family: 'Hahmlet', serif;
  font-weight: 600;
  font-size: 32px;
  letter-spacing: 0.04em;
  color: var(--text-strong);
}

.site-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 32px;
  margin-top: 22px;
  font-size: 16px;
  color: var(--text-sub);
}

.site-nav a.active {
  color: var(--accent-deep);
  font-weight: 700;
  border-bottom: 2px solid var(--accent-deep);
  padding-bottom: 3px;
}

/* Hero */
.hero {
  position: relative;
  height: 520px;
  margin: 0;
  background: var(--bg-slot);
}

.hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(44,53,38,0.05) 0%, rgba(44,53,38,0.55) 100%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 56px;
}

.hero-overlay h1 {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-weight: 400;
  font-size: 44px;
  line-height: 1.55;
  color: #F6F2E4;
  text-shadow: 0 2px 20px rgba(0,0,0,0.3);
}

/* Section intros */
.section-intro {
  text-align: center;
  padding: 72px 40px 40px;
}

.section-intro .eyebrow {
  margin: 0 0 14px;
  font-size: 13px;
  letter-spacing: 0.3em;
  color: var(--text-caption);
}

.section-intro h2 {
  margin: 0;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 34px;
}

/* Three yards grid */
.yards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  padding: 0 40px 72px;
}

.yard-card {
  display: block;
  background: var(--bg-card);
  border: 1px solid var(--border-solid);
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: box-shadow 0.2s;
}

.yard-card:hover {
  box-shadow: 0 16px 40px rgba(60,50,35,0.16);
}

.yard-image {
  position: relative;
  aspect-ratio: 4 / 3;
  background: var(--bg-slot);
}

.yard-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.yard-body {
  padding: 28px 28px 32px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
}

.yard-body .label {
  margin: 0;
  font-size: 13px;
  letter-spacing: 0.26em;
  color: var(--text-caption);
}

.yard-body h3 {
  margin: 0;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 26px;
  color: var(--text-strong);
}

.yard-body p.body {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 16px;
  line-height: 1.85;
  color: var(--text-sub);
  flex: 1;
}

.yard-body .hours {
  margin: 0;
  font-size: 15px;
  color: var(--accent-deep);
  border-top: 1px dashed var(--border-solid);
  padding-top: 14px;
}

/* Confession band */
.confession {
  background: var(--accent-deep);
  color: var(--on-accent);
  padding: 80px 40px;
  text-align: center;
}

.confession .eyebrow {
  margin: 0 0 22px;
  font-size: 13px;
  letter-spacing: 0.3em;
  color: var(--on-accent-sub);
}

.confession p.body {
  margin: 0 auto;
  font-family: 'Gowun Batang', serif;
  font-size: 25px;
  line-height: 2;
  max-width: 40ch;
}

.pill {
  display: inline-block;
  padding: 14px 34px;
  border-radius: 999px;
  font-size: 15px;
}

.pill-outline-light {
  margin-top: 34px;
  border: 1px solid var(--on-accent-sub);
  color: var(--on-accent);
}

.pill-outline-dark {
  border: 1px solid var(--accent-deep);
  color: var(--accent-deep);
}

/* Weekly word */
.weekly-word {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  padding: 80px 40px;
  align-items: center;
}

.video-thumb {
  display: block;
  position: relative;
  aspect-ratio: 16 / 9;
  background: var(--bg-slot);
  border: 1px solid var(--border-solid);
}

.video-thumb .placeholder-label {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: center;
  color: var(--text-caption);
  font-size: 14px;
  letter-spacing: 0.1em;
  text-align: center;
  padding: 0 20px;
}

.play-button {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.play-button span {
  width: 64px;
  height: 64px;
  border-radius: 999px;
  background: rgba(76,90,62,0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 22px;
  padding-left: 4px;
}

.weekly-word-body {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.weekly-word-body .eyebrow {
  margin: 0;
  font-size: 13px;
  letter-spacing: 0.28em;
  color: var(--text-caption);
}

.weekly-word-body h2 {
  margin: 0;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 34px;
  line-height: 1.45;
}

.weekly-word-body p.body {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 17px;
  line-height: 1.9;
  color: var(--text-sub);
}

.weekly-word-body .pill {
  align-self: flex-start;
}

/* News + Visit */
.news-visit {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 56px;
  padding: 0 40px 80px;
}

.news-visit h2 {
  margin: 0 0 28px;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 28px;
}

.news-list {
  display: flex;
  flex-direction: column;
}

.news-item {
  display: flex;
  gap: 24px;
  align-items: baseline;
  padding: 18px 0;
  border-bottom: 1px dashed var(--border-solid);
}

.news-item .date {
  font-size: 14px;
  color: var(--text-caption);
  flex: none;
  width: 88px;
}

.news-item .title {
  font-family: 'Gowun Batang', serif;
  font-size: 17px;
}

.map-slot {
  display: block;
  position: relative;
  aspect-ratio: 4 / 3;
  border: 1px solid var(--border-solid);
  background: var(--bg-slot);
}

.map-slot .placeholder-label {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: center;
  color: var(--text-caption);
  font-size: 14px;
  letter-spacing: 0.1em;
}

.visit-address {
  margin: 18px 0 0;
  font-size: 16px;
  line-height: 1.8;
  color: var(--text-sub);
}

.map-link {
  color: var(--accent-deep);
  text-decoration: underline;
  font-weight: 600;
}

.map-link:hover { color: var(--accent-light); }

/* Footer */
.site-footer {
  border-top: 1px solid var(--border-solid);
  padding: 40px;
  text-align: center;
  font-size: 15px;
  color: var(--text-faint);
  line-height: 1.9;
}

/* Responsive */
@media (max-width: 1080px) {
  .yards-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 720px) {
  .yards-grid,
  .weekly-word,
  .news-visit {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  .hero { height: 420px; }
  .hero-overlay h1 { font-size: 30px !important; line-height: 1.4 !important; }
  .section-intro h2 { font-size: 25px !important; }
}

/* ===================================================================
   Shared inner-page building blocks (about / worship / sermons /
   bakery / bookshop / visit)
   =================================================================== */

.eyebrow {
  margin: 0 0 18px;
  font-size: 13px;
  letter-spacing: 0.3em;
  color: var(--text-caption);
}

/* Intro header used at the top of every inner page */
.page-intro {
  text-align: center;
  padding: 84px 40px 20px;
}

.page-intro h1 {
  margin: 0 auto;
  font-family: 'Gowun Batang', serif;
  font-weight: 400;
  font-size: 40px;
  line-height: 1.6;
  max-width: 28ch;
}

.page-intro .lead {
  margin: 24px auto 0;
  font-family: 'Gowun Batang', serif;
  font-size: 18px;
  line-height: 1.9;
  color: var(--text-sub);
  max-width: 36ch;
}

/* Full-width bordered photo block */
.hero-image {
  position: relative;
  margin: 48px 40px 0;
  background: var(--bg-slot);
  border: 1px solid var(--border-solid);
  overflow: hidden;
}

.hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hero-image--460 { height: 460px; }
.hero-image--480 { height: 480px; }

.hero-image .placeholder-label {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: center;
  color: var(--text-caption);
  font-size: 14px;
  letter-spacing: 0.1em;
  text-align: center;
  padding: 0 24px;
}

/* Generic 2 / 3 column grids, collapsing the same way the design's g2/g3 did */
.grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
}

.grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

@media (max-width: 1080px) {
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 720px) {
  .grid-2, .grid-3 {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  .hero-image--460, .hero-image--480 { height: 320px; margin: 40px 20px 0; }
  .page-intro h1 { font-size: 28px !important; }
}

/* Long-form centered paragraph blocks (story copy) */
.prose {
  max-width: 720px;
  margin: 0 auto;
  padding: 80px 40px;
  text-align: center;
}

.prose p {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 19px;
  line-height: 2.1;
  color: var(--text-body);
}

.prose p + p {
  margin-top: 28px;
  font-size: 17px;
  line-height: 2;
  color: var(--text-sub);
}

/* Solid pill button (dark bg, used for primary CTAs) */
.pill-solid {
  display: inline-block;
  padding: 15px 36px;
  background: var(--accent-deep);
  color: var(--bg-paper);
  border-radius: 999px;
  font-size: 16px;
}

.cta-section {
  padding: 72px 40px;
  text-align: center;
}

.cta-section .lead {
  margin: 0 auto 30px;
  font-family: 'Gowun Batang', serif;
  font-size: 21px;
  line-height: 2;
  max-width: 40ch;
  color: var(--text-body);
}

/* Two-column intro + paragraphs (교회소개 "우리의 고백") */
.confession-grid {
  grid-template-columns: 0.8fr 1.2fr;
  padding: 84px 40px;
}

.confession-grid h2 {
  margin: 0;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 30px;
  line-height: 1.4;
}

.confession-grid .copy {
  display: flex;
  flex-direction: column;
  gap: 28px;
  font-family: 'Gowun Batang', serif;
  font-size: 18px;
  line-height: 2;
  color: var(--text-body);
}

.confession-grid .copy p { margin: 0; }

/* Deep green band with a 3-col value grid (교회소개 "우리가 믿는 것") */
.deep-band {
  background: var(--accent-deep);
  color: var(--on-accent);
  padding: 80px 40px;
}

.deep-band > .eyebrow {
  text-align: center;
  margin-bottom: 40px;
  color: var(--on-accent-sub);
}

.values-grid {
  max-width: 1000px;
  margin: 0 auto;
  gap: 40px;
}

.value-card {
  border-top: 1px solid #6E7A58;
  padding-top: 24px;
}

.value-card h3 {
  margin: 0 0 14px;
  font-family: 'Hahmlet', serif;
  font-weight: 400;
  font-size: 24px;
}

.value-card p {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 16px;
  line-height: 1.9;
  color: var(--on-accent-sub);
}

/* Section heading centered, used before philosophy list / flow list / grids */
.section-heading {
  margin: 0 0 40px;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 30px;
  text-align: center;
}

.section-block { padding: 84px 40px; }

/* Row list: fixed-width label + flexible body, dashed divider (목회 철학) */
.philosophy-list, .flow-list {
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}

.philosophy-row {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 28px;
  padding: 26px 0;
  border-bottom: 1px dashed var(--border-solid);
}

.philosophy-row h3 {
  margin: 0;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 21px;
  color: var(--accent-deep);
}

.philosophy-row p {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 17px;
  line-height: 1.95;
  color: var(--text-body);
}

.pull-quote {
  margin: 48px auto 0;
  font-family: 'Gowun Batang', serif;
  font-size: 22px;
  line-height: 1.9;
  text-align: center;
  max-width: 32ch;
  color: var(--accent-deep);
}

/* Light banded section (걸어온 길, menu, curation) */
.light-band {
  background: var(--bg-card);
  border-top: 1px solid var(--border-solid);
  border-bottom: 1px solid var(--border-solid);
  padding: 72px 40px;
}

.history-band {
  text-align: center;
}

.history-band .year {
  font-family: 'Hahmlet', serif;
  color: var(--accent-deep);
}

.history-band p {
  margin: 0 auto;
  font-family: 'Gowun Batang', serif;
  font-size: 21px;
  line-height: 1.9;
  max-width: 30ch;
  color: var(--text-body);
}

/* 예배의 흐름 numbered rows */
.flow-row {
  display: flex;
  gap: 28px;
  align-items: baseline;
  padding: 20px 0;
  border-bottom: 1px dashed var(--border-solid);
}

.flow-row .no {
  font-family: 'Hahmlet', serif;
  font-size: 18px;
  color: var(--text-caption);
  flex: none;
  width: 40px;
}

.flow-row .name {
  font-family: 'Gowun Batang', serif;
  font-size: 19px;
  flex: none;
  width: 130px;
}

.flow-row .note {
  font-family: 'Gowun Batang', serif;
  font-size: 15px;
  color: var(--text-faint);
  flex: 1;
  line-height: 1.6;
}

@media (max-width: 720px) {
  .confession-grid { grid-template-columns: 1fr !important; }
  .philosophy-row { grid-template-columns: 1fr !important; gap: 8px !important; }
  .flow-row { flex-wrap: wrap; }
}

/* Split card: bordered box, image one side / copy the other, no gap (주일예배 카드) */
.split-card {
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin: 56px 40px 0;
  border: 1px solid var(--border-solid);
  background: var(--bg-card);
}

.split-card .media {
  position: relative;
  min-height: 360px;
  background: var(--bg-slot);
}

.split-card .media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  position: absolute;
  inset: 0;
}

.split-card .body {
  padding: 56px 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
}

.split-card .body .eyebrow { margin: 0; }

.split-card .body .headline {
  margin: 0;
  font-family: 'Hahmlet', serif;
  font-size: 40px;
}

.split-card .body p.copy {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 17px;
  line-height: 1.9;
  color: var(--text-sub);
}

@media (max-width: 720px) {
  .split-card { grid-template-columns: 1fr !important; margin: 40px 20px 0; }
  .split-card .media { min-height: 240px; }
}

/* Feature split: media + copy + pill, reused by "책방 모임" etc. */
.feature-split {
  padding: 84px 40px;
  align-items: center;
}

.feature-split .media {
  position: relative;
  aspect-ratio: 4 / 3;
  background: var(--bg-slot);
  border: 1px solid var(--border-solid);
}

.feature-split .media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.feature-split .body {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.feature-split .body .eyebrow { margin: 0; }

.feature-split .body h2 {
  margin: 0;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 30px;
  line-height: 1.4;
}

.feature-split .body p.copy {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 17px;
  line-height: 1.95;
  color: var(--text-body);
}

.feature-split .body .note {
  margin: 0;
  font-size: 15px;
  color: var(--accent-deep);
}

/* Info strip: evenly divided columns with vertical dividers */
.info-strip {
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}

.info-strip.cols-2 { grid-template-columns: repeat(2, 1fr); }

.info-strip > div {
  padding: 56px 40px;
  text-align: center;
  border-right: 1px solid var(--border-solid);
}

.info-strip > div:last-child { border-right: none; }

.info-strip .label {
  margin: 0 0 10px;
  font-size: 13px;
  letter-spacing: 0.2em;
  color: var(--text-caption);
}

.info-strip .value {
  margin: 0;
  font-family: 'Hahmlet', serif;
  font-size: 22px;
  line-height: 1.5;
}

@media (max-width: 720px) {
  .info-strip { grid-template-columns: 1fr !important; }
  .info-strip > div {
    border-right: none !important;
    border-bottom: 1px solid var(--border-solid);
  }
  .info-strip > div:last-child { border-bottom: none; }
}

/* Simple bordered cards used for menu items / curated shelves / route cards */
.simple-card {
  background: var(--bg-paper);
  border: 1px solid var(--border-solid);
  padding: 34px 28px;
  text-align: center;
}

.simple-card .name {
  margin: 0;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 24px;
  color: var(--text-strong);
}

.shelf-card {
  background: var(--bg-paper);
  border: 1px solid var(--border-solid);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-align: left;
}

.shelf-card .tag {
  margin: 0;
  font-size: 13px;
  letter-spacing: 0.22em;
  color: var(--text-caption);
}

.shelf-card h3 {
  margin: 0;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 24px;
}

.shelf-card p {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 16px;
  line-height: 1.85;
  color: var(--text-sub);
}

/* Video thumbnails for sermon pages, larger play button variants */
.play-button--lg span {
  width: 72px;
  height: 72px;
  font-size: 24px;
}

.play-button--sm span {
  width: 52px;
  height: 52px;
  font-size: 17px;
  background: rgba(76,90,62,0.85);
}

.sermon-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.sermon-card .meta {
  margin: 0 0 6px;
  font-size: 14px;
  color: var(--text-caption);
}

.sermon-card .title {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 19px;
  line-height: 1.5;
}

/* Address / route two & three column text blocks */
.address-grid h2, .feature-split .body h2 {
  font-family: 'Hahmlet', serif;
}

.address-block h2 {
  margin: 0 0 20px;
  font-family: 'Hahmlet', serif;
  font-weight: 500;
  font-size: 26px;
}

.address-block p {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 19px;
  line-height: 1.9;
  color: var(--text-body);
}

.way-card {
  background: var(--bg-paper);
  border: 1px solid var(--border-solid);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-align: left;
}

.way-card .mode {
  margin: 0;
  font-size: 13px;
  letter-spacing: 0.22em;
  color: var(--text-caption);
}

.way-card p.body {
  margin: 0;
  font-family: 'Gowun Batang', serif;
  font-size: 16.5px;
  line-height: 1.9;
  color: var(--text-body);
}

/* ===================================================================
   질문 게시판 (Q&A board + admin)
   =================================================================== */

.qna-form {
  max-width: 640px;
  margin: 0 auto;
  padding: 40px;
  background: var(--bg-card);
  border: 1px solid var(--border-solid);
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.qna-field { display: flex; flex-direction: column; gap: 8px; }

.qna-field label {
  font-size: 13px;
  letter-spacing: 0.1em;
  color: var(--text-caption);
}

.qna-field input[type="text"],
.qna-field select,
.qna-field textarea {
  width: 100%;
  font-family: 'Gowun Dodum', sans-serif;
  font-size: 16px;
  padding: 12px 14px;
  border: 1px solid var(--border-solid);
  background: var(--bg-paper);
  color: var(--text-strong);
  border-radius: 4px;
}

.qna-field textarea {
  min-height: 140px;
  line-height: 1.7;
  resize: vertical;
}

.qna-field input:focus,
.qna-field select:focus,
.qna-field textarea:focus {
  outline: 2px solid var(--accent-light);
  outline-offset: 1px;
}

.qna-honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.qna-submit-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }

.qna-form button {
  align-self: flex-start;
  padding: 14px 34px;
  background: var(--accent-deep);
  color: var(--bg-paper);
  border: none;
  border-radius: 999px;
  font-size: 16px;
  font-family: 'Gowun Dodum', sans-serif;
  cursor: pointer;
}

.qna-form button:hover { background: var(--accent-light); }
.qna-form button:disabled { opacity: 0.5; cursor: default; }

.qna-status {
  font-size: 14px;
  line-height: 1.7;
}

.qna-status.error { color: #a8443b; }
.qna-status.success { color: var(--accent-deep); }

.qna-note {
  max-width: 640px;
  margin: 18px auto 0;
  font-size: 14px;
  color: var(--text-faint);
  line-height: 1.7;
  text-align: center;
}

.qna-list {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}

.qna-item {
  padding: 32px 0;
  border-bottom: 1px dashed var(--border-solid);
}

.qna-item .meta {
  display: flex;
  gap: 12px;
  align-items: baseline;
  font-size: 13px;
  color: var(--text-caption);
  letter-spacing: 0.05em;
  margin: 0 0 10px;
}

.qna-item .meta .category {
  color: var(--accent-deep);
  font-weight: 700;
}

.qna-item .q-text {
  font-family: 'Gowun Batang', serif;
  font-size: 18px;
  line-height: 1.8;
  color: var(--text-strong);
  margin: 0 0 18px;
  white-space: pre-wrap;
}

.qna-item .a-block {
  background: var(--bg-card);
  border-left: 3px solid var(--accent-deep);
  padding: 18px 22px;
}

.qna-item .a-label {
  font-size: 13px;
  color: var(--accent-deep);
  font-weight: 700;
  margin: 0 0 8px;
}

.qna-item .a-text {
  font-family: 'Gowun Batang', serif;
  font-size: 16px;
  line-height: 1.9;
  color: var(--text-body);
  margin: 0;
  white-space: pre-wrap;
}

.qna-empty {
  text-align: center;
  padding: 60px 40px;
  color: var(--text-faint);
  font-size: 15px;
}

/* Admin page */
.qna-admin-item {
  max-width: 800px;
  margin: 0 auto 28px;
  padding: 28px;
  background: var(--bg-card);
  border: 1px solid var(--border-solid);
}

.qna-admin-item .meta {
  display: flex;
  gap: 12px;
  align-items: baseline;
  font-size: 13px;
  color: var(--text-caption);
  margin: 0 0 12px;
}

.qna-admin-item .q-text {
  font-family: 'Gowun Batang', serif;
  font-size: 17px;
  line-height: 1.8;
  color: var(--text-strong);
  margin: 0 0 18px;
  white-space: pre-wrap;
}

.qna-admin-item textarea {
  width: 100%;
  min-height: 100px;
  font-family: 'Gowun Dodum', sans-serif;
  font-size: 15px;
  line-height: 1.7;
  padding: 12px 14px;
  border: 1px solid var(--border-solid);
  background: var(--bg-paper);
  color: var(--text-strong);
  border-radius: 4px;
  resize: vertical;
  margin-bottom: 12px;
}

.qna-admin-item .row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }

.qna-admin-item button {
  padding: 10px 24px;
  border-radius: 999px;
  font-size: 14px;
  font-family: 'Gowun Dodum', sans-serif;
  cursor: pointer;
  border: none;
}

.qna-admin-item .answer-btn { background: var(--accent-deep); color: var(--bg-paper); }
.qna-admin-item .answer-btn:hover { background: var(--accent-light); }
.qna-admin-item .delete-btn { background: transparent; color: var(--text-faint); border: 1px solid var(--border-solid); }
.qna-admin-item .delete-btn:hover { color: #a8443b; border-color: #a8443b; }

.qna-admin-item .answered-block {
  background: var(--bg-paper);
  border-left: 3px solid var(--accent-deep);
  padding: 14px 18px;
  font-family: 'Gowun Batang', serif;
  font-size: 15px;
  line-height: 1.8;
  color: var(--text-body);
  white-space: pre-wrap;
}

.qna-admin-login {
  max-width: 400px;
  margin: 100px auto;
  text-align: center;
  padding: 48px 40px;
  background: var(--bg-card);
  border: 1px solid var(--border-solid);
}