/* ==========================================================================
   A2W (Kadence Child) — v4 디자인 레이어
   ==========================================================================
   소유 경계
     · 폰트 크기 / 색상 값   = Kadence theme_mod + kadence_global_palette
     · 여기(child CSS)       = 레이아웃 · 컴포넌트 · 여백 · 배경
     · 테마 무관 사이트 규칙  = a2w-core MU-plugin
   그래서 이 파일은 body / h1 / h2 / h3 의 font-size · color 를 정의하지 않는다.
   A2W 전용 컴포넌트(.a2w-*)에만 크기를 지정한다.

   외부 폰트 / 외부 CSS / 외부 JS / 이미지 파일 없음.
   ========================================================================== */

:root {
  --a2w-bg0: #FFFFFF;
  --a2w-bg1: #F2F6FB;
  --a2w-bg2: #E7EFFA;
  --a2w-card: #F7FAFD;

  --a2w-line:      #D5DEE9;
  --a2w-line-soft: #E4EAF2;
  --a2w-line-blue: #C2D5EE;

  --a2w-navy:      #0F1B2E;
  --a2w-navy-dim:  #C7D2E0;
  --a2w-navy-link: #93B4E0;
  --a2w-navy-line: #27374F;

  --a2w-code-bg: #101A2B;
  --a2w-code-fg: #E5EAF3;
  --a2w-warn-bg: #FBF5EC;

  --a2w-home-max: 1120px;
  --a2w-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "D2Coding", "Courier New", monospace;
}

/* 한국어 줄바꿈 — 없으면 "괜찮 / 습니다" 처럼 단어 중간에서 끊어진다.
   Kadence global.min.css 가 `.entry-content{word-break:break-word}` 를 갖고 있어
   body 에만 걸면 특이도에서 진다. 같은 선택자에 맞춰 한 번만 정의한다. */
body { word-break: keep-all; overflow-wrap: break-word; }
.entry-content { word-break: keep-all; }
/* 코드·표·프롬프트는 예외. 긴 영문·경로가 넘치면 안 되므로 어디서든 끊는다. */
pre, code, .a2w-mini,
.entry-content pre, .entry-content code, .entry-content table { word-break: normal; overflow-wrap: anywhere; }

/* ==========================================================================
   HEADER
   ========================================================================== */
#masthead { border-bottom: 1px solid var(--a2w-line); }

/* 헤더는 이미지 로고만 쓴다(logo_layout include = logo).
   그래서 .site-title / .site-title-wrap 은 출력되지 않는다.
   예전에 CSS 로 그리던 "A2W + AI TO WORK" 워드마크 규칙은 죽은 코드라 지웠다.
   로고 이미지가 배경 투명(alpha 0)이라 흰 헤더에 그대로 얹힌다. */
.site-branding .custom-logo { display: block; }
.main-navigation .primary-menu-container > ul > li.menu-item > a {
  font-size: 15.5px; font-weight: 600;
}

/* ==========================================================================
   FOOTER — deep navy
   ========================================================================== */
#colophon.site-footer { background: var(--a2w-navy); color: var(--a2w-navy-dim); }
#colophon .site-footer-row-container-inner { background: transparent; }
#colophon .footer-html, #colophon .site-info { color: var(--a2w-navy-dim); font-size: 13.5px; }
#colophon a { color: var(--a2w-navy-link); }
#colophon a:hover { color: #FFFFFF; }
#colophon .site-bottom-footer-inner-wrap { padding-top: 34px; padding-bottom: 34px; }

/* ==========================================================================
   HOME — Kadence 컨테이너 여백 제거 (섹션이 스스로 여백을 갖는다)
   ========================================================================== */
.a2w-home .content-container.site-container { padding-left: 0; padding-right: 0; max-width: none; }
.a2w-home .entry-content-wrap { padding: 0; }
.a2w-home .entry-content > *:first-child { margin-top: 0; }
.a2w-home .entry-content > *:last-child { margin-bottom: 0; }

/* ==========================================================================
   HOME — 섹션 공통
   ========================================================================== */
.a2w-sec { padding: 82px 0; }
.a2w-sec--0 { background: var(--a2w-bg0); }
.a2w-sec--1 { background: var(--a2w-bg1); }
.a2w-sec--2 { background: var(--a2w-bg2); }
.a2w-sec--lead { padding: 96px 0 100px; }

.a2w-wrap { max-width: var(--a2w-home-max); margin: 0 auto; padding: 0 24px; }

.a2w-head { margin: 0 0 34px; }
.a2w-eyebrow {
  display: block; font-family: var(--a2w-mono); font-size: 11px; font-weight: 700;
  letter-spacing: .2em; color: var(--global-palette12); margin-bottom: 12px;
}
.a2w-h2 { font-size: 28px; line-height: 1.4; font-weight: 800; color: var(--global-palette3); margin: 0; }
.a2w-sec--lead .a2w-h2 { font-size: 34px; letter-spacing: -.01em; }
.a2w-desc { font-size: 16px; line-height: 1.75; color: var(--global-palette5); margin: 12px 0 0; max-width: 44em; }
.a2w-bar { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.a2w-more { font-size: 15px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.a2w-more:hover { text-decoration: underline; }

/* ==========================================================================
   HERO
   ========================================================================== */
.a2w-hero { position: relative; background: var(--a2w-bg2); overflow: hidden; border-bottom: 1px solid var(--a2w-line-blue); }
.a2w-hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(to right,  rgba(29,78,137,.075) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(29,78,137,.075) 1px, transparent 1px);
  background-size: 62px 62px;
  mask-image: radial-gradient(ellipse 80% 82% at 74% 48%, #000 14%, transparent 76%);
  -webkit-mask-image: radial-gradient(ellipse 80% 82% at 74% 48%, #000 14%, transparent 76%);
}
.a2w-hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(620px 460px at 76% 24%, rgba(11,98,116,.18), transparent 66%),
    radial-gradient(740px 560px at 98% 86%, rgba(29,78,137,.15), transparent 68%);
}
.a2w-hero__inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr; gap: 40px; padding: 80px 0 66px; }
.a2w-hero__copy { min-height: 300px; position: relative; }

.a2w-slide { position: absolute; inset: 0; opacity: 0; transform: translateY(12px); transition: opacity .75s ease, transform .75s ease; pointer-events: none; }
.a2w-slide.is-active { opacity: 1; transform: translateY(0); pointer-events: auto; }
.a2w-slide__eyebrow { display: block; font-family: var(--a2w-mono); font-size: 11.5px; font-weight: 700; letter-spacing: .2em; color: var(--global-palette12); margin-bottom: 22px; }
.a2w-hero__title { font-size: 34px; line-height: 1.26; font-weight: 800; letter-spacing: -.012em; color: var(--global-palette3); margin: 0 0 24px; }
.a2w-slide p { font-size: 17px; line-height: 1.85; color: var(--global-palette5); margin: 0; max-width: 30em; }

.a2w-hero__ctrl { position: relative; z-index: 1; display: flex; align-items: center; gap: 18px; padding-bottom: 62px; }
.a2w-count { font-family: var(--a2w-mono); font-size: 13px; letter-spacing: .1em; color: var(--global-palette6); min-width: 62px; }
.a2w-count b { color: var(--global-palette3); font-weight: 700; }
.a2w-dots { display: flex; gap: 10px; }
.a2w-dots button { width: 9px; height: 9px; padding: 0; border-radius: 50%; cursor: pointer; border: 1px solid var(--global-palette1); background: transparent; }
.a2w-dots button[aria-selected="true"] { background: var(--global-palette1); }
.a2w-arrows { display: flex; gap: 8px; margin-left: 4px; }
.a2w-arrows button { width: 40px; height: 40px; padding: 0; cursor: pointer; line-height: 1; border: 1px solid var(--a2w-line-blue); background: rgba(255,255,255,.78); color: var(--global-palette5); border-radius: 3px; }
.a2w-arrows button:hover { border-color: var(--global-palette1); color: var(--global-palette1); }

/* --- Hero AI visual --- */
.a2w-viz { position: relative; display: none; }
.a2w-pcard { background: rgba(255,255,255,.93); border: 1px solid var(--a2w-line-blue); border-radius: 9px; padding: 17px 19px; box-shadow: 0 3px 14px rgba(15,27,46,.06); }
.a2w-pcard__label { display: flex; align-items: center; gap: 9px; font-family: var(--a2w-mono); font-size: 10px; font-weight: 700; letter-spacing: .18em; color: var(--global-palette12); margin: 0 0 13px; }
.a2w-pcard__label::after { content: ""; flex: 1; height: 1px; background: var(--a2w-line-blue); }

.a2w-viz__main { position: relative; z-index: 3; margin: 104px 52px 0 0; padding: 18px 22px; }
.a2w-query { display: flex; align-items: center; gap: 10px; border: 1px solid var(--a2w-line-blue); border-radius: 7px; background: #FFFFFF; padding: 10px 13px; margin-bottom: 14px; }
.a2w-query span { font-size: 14.5px; color: var(--global-palette5); flex: 1; }
.a2w-query em { font-style: normal; font-family: var(--a2w-mono); font-size: 10px; font-weight: 700; letter-spacing: .1em; color: #FFFFFF; background: var(--global-palette1); padding: 5px 10px; border-radius: 3px; }

.a2w-vizflow { list-style: none; margin: 0; padding: 0; }
.a2w-vizflow li { position: relative; padding-left: 32px; font-size: 15.5px; font-weight: 700; color: var(--global-palette3); line-height: 1.5; margin-bottom: 15px; }
.a2w-vizflow li:last-child { margin-bottom: 0; }
.a2w-vizflow li::before { content: ""; position: absolute; left: 3px; top: 7px; width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--global-palette1); background: #FFFFFF; box-shadow: 0 0 0 5px rgba(29,78,137,.10); }
.a2w-vizflow li:not(:last-child)::after {
  content: ""; position: absolute; left: 8px; top: 23px; width: 2px; height: 22px; border-radius: 2px;
  background: linear-gradient(to bottom, rgba(29,78,137,.10) 0%, var(--global-palette1) 42%, rgba(11,98,116,.10) 100%);
  background-size: 100% 260%; animation: a2w-vizflow 3.4s linear infinite;
}
.a2w-vizflow li span { display: block; font-size: 13px; font-weight: 400; color: var(--global-palette6); margin-top: 3px; }
.a2w-vizflow li.is-last::before { border-color: var(--global-palette12); box-shadow: 0 0 0 5px rgba(11,98,116,.12); }
@keyframes a2w-vizflow { from { background-position: 0 -130%; } to { background-position: 0 130%; } }

.a2w-pcard--news   { position: absolute; z-index: 2; top: 0; right: 0; width: 60%; }
.a2w-pcard--prompt { position: absolute; z-index: 1; bottom: 0; left: 2%; width: 66%; padding-top: 28px; }
.a2w-nowlist { display: flex; flex-wrap: wrap; gap: 6px; }
.a2w-nowlist span { font-family: var(--a2w-mono); font-size: 10px; font-weight: 700; letter-spacing: .1em; border: 1px solid var(--a2w-line-blue); border-radius: 3px; padding: 3px 8px; color: var(--global-palette5); }
.a2w-nowlist span.on { color: #FFFFFF; background: var(--global-palette12); border-color: var(--global-palette12); }
.a2w-mini { font-family: var(--a2w-mono); font-size: 11.5px; line-height: 1.7; background: var(--a2w-code-bg); color: var(--a2w-code-fg); border-radius: 6px; padding: 11px 13px; margin: 0; white-space: pre; overflow: hidden; }
.a2w-pcard__foot { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--global-palette6); margin: 8px 0 0; }
.a2w-pcard__foot b { color: var(--global-palette12); font-family: var(--a2w-mono); font-size: 10px; letter-spacing: .1em; }

.a2w-viz__tag { position: absolute; z-index: 4; right: 0; bottom: 122px; display: flex; align-items: center; gap: 9px; background: rgba(255,255,255,.96); border: 1px solid var(--a2w-line-blue); border-left: 3px solid var(--global-palette1); border-radius: 6px; padding: 10px 14px; box-shadow: 0 3px 14px rgba(15,27,46,.07); font-size: 12.5px; color: var(--global-palette5); white-space: nowrap; }
.a2w-viz__tag b { color: var(--global-palette3); }
.a2w-viz__tag em { font-style: normal; font-family: var(--a2w-mono); font-size: 10px; letter-spacing: .1em; color: var(--global-palette1); font-weight: 700; }
.a2w-viz__tag i { width: 7px; height: 7px; border-radius: 50%; background: var(--global-palette12); flex: none; animation: a2w-pulse 2.6s ease-in-out infinite; }
@keyframes a2w-pulse { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }

.a2w-wire { position: absolute; z-index: 0; inset: 0; pointer-events: none; }
.a2w-wire b { position: absolute; height: 1px; transform-origin: left center; background: linear-gradient(to right, rgba(29,78,137,.34), rgba(11,98,116,.06)); }
.a2w-wire b:nth-child(1) { left: 3%; top: 6%; width: 34%; transform: rotate(34deg); }
.a2w-wire b:nth-child(2) { left: 64%; top: 92%; width: 32%; transform: rotate(-26deg); }
.a2w-wire i { position: absolute; width: 8px; height: 8px; border-radius: 50%; border: 2px solid var(--global-palette12); background: var(--a2w-bg2); opacity: .75; }
.a2w-wire i:nth-child(3) { left: 2%; top: 5%; }
.a2w-wire i:nth-child(4) { left: 94%; top: 88%; }

.a2w-motif { position: absolute; z-index: 0; right: -14px; bottom: 4px; width: 240px; height: 200px; pointer-events: none; }
.a2w-motif i { position: absolute; width: 9px; height: 9px; border-radius: 50%; border: 2px solid var(--global-palette1); background: var(--a2w-bg2); opacity: .6; }
.a2w-motif i:nth-child(1) { left: 10%; top: 20%; }
.a2w-motif i:nth-child(2) { left: 48%; top: 56%; border-color: var(--global-palette12); }
.a2w-motif i:nth-child(3) { left: 84%; top: 22%; }
.a2w-motif b { position: absolute; height: 1px; transform-origin: left center; background: linear-gradient(to right, rgba(29,78,137,.42), rgba(11,98,116,.12)); }
.a2w-motif b:nth-child(4) { left: 13%; top: 23%; width: 44%; transform: rotate(34deg); }
.a2w-motif b:nth-child(5) { left: 51%; top: 58%; width: 40%; transform: rotate(-40deg); }

/* ==========================================================================
   START — STEP 카드
   ========================================================================== */
.a2w-steps { display: grid; grid-template-columns: 1fr; gap: 16px; }
.a2w-step { display: block; text-decoration: none; background: var(--a2w-card); border: 1px solid var(--a2w-line); border-radius: 9px; padding: 24px 22px; }
.a2w-step:hover { border-color: var(--global-palette1); background: #FFFFFF; }
.a2w-step__n { display: inline-block; font-family: var(--a2w-mono); font-size: 10.5px; font-weight: 700; letter-spacing: .14em; color: #FFFFFF; background: var(--global-palette1); padding: 4px 10px; border-radius: 3px; margin-bottom: 14px; }
.a2w-step h3 { font-size: 19px; line-height: 1.45; font-weight: 700; color: var(--global-palette3); margin: 0 0 8px; }
.a2w-step p { font-size: 15px; line-height: 1.7; color: var(--global-palette5); margin: 0; }

/* ==========================================================================
   이미지 공통 — 실제 이미지가 들어가는 자리
   ========================================================================== */
.a2w-img {
  display: block; width: 100%; height: auto;
  border-radius: 8px; border: 1px solid var(--a2w-line);
  background: var(--a2w-card);
}

/* START HERE 대표 비주얼 */
.a2w-lead { display: grid; grid-template-columns: 1fr; gap: 24px; margin: 0 0 34px; align-items: center; }
.a2w-lead__img { min-width: 0; }
.a2w-lead__txt { min-width: 0; }

/* ==========================================================================
   DIRECTORY
   ========================================================================== */
.a2w-dir { display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--a2w-line); }
.a2w-dir__item { display: block; text-decoration: none; position: relative; padding: 22px 34px 22px 0; border-bottom: 1px solid var(--a2w-line-soft); }
.a2w-dir__thumb { display: block; margin: 0 0 14px; }
.a2w-dir__thumb .a2w-img { aspect-ratio: 16 / 9; object-fit: cover; }
.a2w-dir__item:hover .a2w-img { border-color: var(--global-palette1); }
.a2w-dir__label { display: block; font-family: var(--a2w-mono); font-size: 10.5px; font-weight: 700; letter-spacing: .2em; color: var(--global-palette12); margin-bottom: 8px; }
.a2w-dir__item h3 { font-size: 19px; line-height: 1.4; font-weight: 700; color: var(--global-palette3); margin: 0 0 6px; }
.a2w-dir__item p { font-size: 14.5px; line-height: 1.65; color: var(--global-palette6); margin: 0; }
.a2w-dir__item::after { content: "\2192"; position: absolute; right: 8px; top: 50%; transform: translateY(-50%); color: var(--a2w-line); font-size: 15px; }
.a2w-dir__item:hover h3, .a2w-dir__item:hover::after { color: var(--global-palette1); }

/* ==========================================================================
   Query Loop 결과 — 최신 가이드 / AI 소식
   ========================================================================== */
.a2w-guide .wp-block-post-template { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--a2w-line); }
.a2w-guide .wp-block-post-template > li { padding: 24px 0; border-bottom: 1px solid var(--a2w-line-soft); }
.a2w-guide .wp-block-post-title { font-size: 20px; line-height: 1.5; font-weight: 700; margin: 8px 0 8px; }
.a2w-guide .wp-block-post-title a { color: var(--global-palette3); text-decoration: none; }
.a2w-guide .wp-block-post-title a:hover { color: var(--global-palette1); }
.a2w-guide .wp-block-post-excerpt { font-size: 16px; line-height: 1.7; color: var(--global-palette5); margin: 0 0 8px; }
.a2w-guide .wp-block-post-excerpt__excerpt { margin: 0; }
.a2w-guide .wp-block-post-date { font-size: 14px; color: var(--global-palette6); }
.a2w-guide .wp-block-post-terms { font-size: 12px; font-weight: 700; color: var(--global-palette1); }
.a2w-guide .wp-block-post-terms a { color: var(--global-palette1); text-decoration: none; }
.a2w-guide .wp-block-post-featured-image { margin: 0 0 12px; }
.a2w-guide .wp-block-post-featured-image img { border-radius: 6px; border: 1px solid var(--a2w-line); }

.a2w-news .wp-block-post-template { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--a2w-line); }
.a2w-news .wp-block-post-template > li { padding: 15px 0; border-bottom: 1px solid var(--a2w-line-soft); }
.a2w-news .wp-block-post-title { font-size: 16.5px; line-height: 1.55; font-weight: 700; margin: 0 0 4px; }
.a2w-news .wp-block-post-title a { color: var(--global-palette3); text-decoration: none; }
.a2w-news .wp-block-post-title a:hover { color: var(--global-palette1); }
.a2w-news .wp-block-post-date { font-family: var(--a2w-mono); font-size: 12px; color: var(--global-palette6); letter-spacing: .04em; }

/* 글이 아직 없을 때 — 빈 화면 대신 안내 */
.a2w-empty { border: 1px dashed var(--a2w-line); border-radius: 8px; padding: 28px 24px; text-align: center; }
.a2w-empty p { font-size: 15.5px; line-height: 1.75; color: var(--global-palette6); margin: 0; }

/* ==========================================================================
   배지 (실제 글 데이터가 생기면 사용)
   ========================================================================== */
.a2w-badge { display: inline-block; font-family: var(--a2w-mono); font-size: 10.5px; font-weight: 700; letter-spacing: .12em; padding: 3px 8px; border-radius: 3px; border: 1px solid currentColor; white-space: nowrap; }
.a2w-badge--new    { color: #FFFFFF; background: var(--global-palette12); border-color: var(--global-palette12); }
.a2w-badge--free   { color: #FFFFFF; background: var(--global-palette1);  border-color: var(--global-palette1); }
.a2w-badge--update { color: var(--global-palette1); }
.a2w-badge--event  { color: var(--global-palette14); }
.a2w-badge--price  { color: var(--global-palette5); }

/* ==========================================================================
   ARTICLE — 미래 장식 없음. 읽기가 최우선.
   크기·색은 theme_mod 가 소유하므로 여기서는 여백·형태만.
   ========================================================================== */
.entry-content > * { margin-top: 0; }
.entry-content h2 { margin-top: 56px; padding-top: 20px; border-top: 1px solid var(--a2w-line-soft); }
.entry-content h3 { margin-top: 36px; }
.entry-content a { text-underline-offset: 3px; }

.entry-content blockquote { margin: 32px 0; padding: 4px 0 4px 22px; border-left: 4px solid var(--global-palette1); color: var(--global-palette5); }
.entry-content blockquote cite { display: block; margin-top: 10px; font-size: 14px; font-style: normal; color: var(--global-palette6); }

/* 핵심 포인트 / 주의 — 코어 인용 블록에 클래스만 붙여 만든다 */
.entry-content .a2w-callout { margin: 32px 0; padding: 20px 22px; border-left: 4px solid var(--global-palette1); background: var(--global-palette7); border-radius: 0 6px 6px 0; }
.entry-content .a2w-callout > *:last-child { margin-bottom: 0; }
.entry-content .a2w-callout__label { display: block; font-size: 12px; font-weight: 800; letter-spacing: .1em; color: var(--global-palette1); margin-bottom: 8px; }
.entry-content .a2w-callout--warn { border-left-color: var(--global-palette14); background: var(--a2w-warn-bg); }
.entry-content .a2w-callout--warn .a2w-callout__label { color: var(--global-palette14); }

.entry-content pre, .entry-content .wp-block-code {
  margin: 28px 0; padding: 18px 20px; border-radius: 7px;
  background: var(--a2w-code-bg); color: var(--a2w-code-fg);
  overflow-x: auto; font-family: var(--a2w-mono); font-size: 14px; line-height: 1.7; border: 0;
}
.entry-content :not(pre) > code { font-family: var(--a2w-mono); font-size: .92em; background: var(--global-palette7); padding: 2px 6px; border-radius: 3px; color: var(--global-palette3); }

.entry-content .wp-block-table { overflow-x: auto; margin: 28px 0; }
.entry-content table { border-collapse: collapse; width: 100%; font-size: 16px; }
.entry-content th, .entry-content td { border: 1px solid var(--a2w-line); padding: 10px 12px; text-align: left; }
.entry-content th { background: var(--global-palette7); color: var(--global-palette3); font-weight: 700; }

.entry-content figure img { border-radius: 6px; }
.entry-content figcaption { font-size: 14px; color: var(--global-palette6); margin-top: 10px; }

/* ==========================================================================
   아카이브 목록
   ========================================================================== */
.archive .loop-entry, .blog .loop-entry { border-bottom: 1px solid var(--a2w-line-soft); }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (min-width: 640px) {
  .a2w-steps { grid-template-columns: repeat(2, 1fr); }
  .a2w-dir { grid-template-columns: repeat(2, 1fr); column-gap: 40px; }
  .a2w-guide .wp-block-post-template.is-flex-container > li { display: block; }
}

@media (min-width: 640px) {
  .a2w-lead { grid-template-columns: 1fr 1fr; gap: 30px; }
}

@media (min-width: 900px) {
  .a2w-lead { grid-template-columns: 1.05fr 1fr; gap: 40px; }
  .a2w-hero__inner { grid-template-columns: minmax(0, 48%) minmax(0, 52%); gap: 40px; align-items: center; padding: 92px 0 74px; }
  .a2w-hero__copy { min-height: 360px; }
  .a2w-hero__title { font-size: 60px; line-height: 1.2; }
  .a2w-slide p { font-size: 18.5px; }
  .a2w-hero__ctrl { padding-bottom: 88px; }

  .a2w-viz { display: block; min-height: 660px; }
  .a2w-motif { display: none; }

  .a2w-steps { grid-template-columns: repeat(4, 1fr); }
  .a2w-dir { grid-template-columns: repeat(3, 1fr); column-gap: 40px; }
}

@media (max-width: 767px) {
  .a2w-wrap { padding-left: 16px; padding-right: 16px; }
  .a2w-hero__inner { padding: 56px 0 42px; }
  .a2w-hero__copy { min-height: 276px; }
  .a2w-hero__title { font-size: 31px; line-height: 1.32; }
  .a2w-slide p { font-size: 16px; }
  .a2w-hero__ctrl { padding-bottom: 48px; }
  .a2w-hero::before {
    mask-image: radial-gradient(ellipse 120% 60% at 82% 80%, #000 8%, transparent 72%);
    -webkit-mask-image: radial-gradient(ellipse 120% 60% at 82% 80%, #000 8%, transparent 72%);
  }
  .a2w-hero::after {
    background:
      radial-gradient(400px 320px at 88% 16%, rgba(11,98,116,.17), transparent 66%),
      radial-gradient(440px 360px at 100% 92%, rgba(29,78,137,.15), transparent 68%);
  }
  .a2w-sec { padding: 52px 0; }
  .a2w-sec--lead { padding: 60px 0 62px; }
  .a2w-h2 { font-size: 22px; }
  .a2w-sec--lead .a2w-h2 { font-size: 25px; }
}

/* ==========================================================================
   움직임 최소화 설정 존중
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .a2w-slide { transition: none; transform: none; }
  .a2w-slide.is-active { transform: none; }
  .a2w-vizflow li:not(:last-child)::after, .a2w-viz__tag i { animation: none !important; }
}

/* ==========================================================================
   A2W 콘텐츠 컴포넌트 (글 본문용)
   ==========================================================================
   블록 에디터에서 코어 블록에 클래스만 붙이면 된다. 커스텀 블록을 만들지 않는다.
   그래야 Content Studio -> REST API 로 글을 넣을 때도 그대로 통한다.

     .a2w-warn      주의        core/group  또는 core/paragraph
     .a2w-tip       팁          core/group  또는 core/paragraph
     .a2w-compare   비교 2단     core/columns
     .a2w-flow      단계 흐름도   core/list (ol 권장)
     .a2w-check     체크리스트    core/list (ul)
     .a2w-prompt    프롬프트 박스  core/code

   색은 Kadence 팔레트 변수만 쓴다. 여기서 색을 새로 만들지 않는다.
     palette1 #1D4E89 포인트 · palette3 #111827 제목 · palette5 #374151 보조
     palette6 #5B6472 메타   · palette7 #EDF2F8 옅은배경 · palette12 #0B6274 시안
     palette14 #8A5A14 주의
   ========================================================================== */

:root {
  --a2w-warn-bg: #FBF5EC;   /* palette14 텍스트가 5.45:1 로 AA */
  --a2w-tip-bg:  #ECF4F7;   /* palette12 텍스트가 6.5:1 로 AA */
}

/* --- 공통: 본문 안에서의 위아래 여백 --- */
.entry-content .a2w-warn,
.entry-content .a2w-tip,
.entry-content .a2w-compare,
.entry-content .a2w-flow,
.entry-content .a2w-check,
.entry-content .a2w-prompt,
.entry-content .a2w-prompt-how { margin: 32px 0; }

/* ==========================================================================
   1) 주의 박스 .a2w-warn
   ========================================================================== */
.entry-content .a2w-warn {
  border-left: 5px solid var(--global-palette14);
  background: var(--a2w-warn-bg);
  border-radius: 0 8px 8px 0;
  padding: 20px 22px;
}
.entry-content .a2w-warn > *:first-child { margin-top: 0; }
.entry-content .a2w-warn > *:last-child { margin-bottom: 0; }
.entry-content .a2w-warn::before {
  content: "주의";
  display: block; margin-bottom: 10px;
  font-size: 12.5px; font-weight: 800; letter-spacing: .08em;
  color: var(--global-palette14);
}
/* 라벨 문구를 바꾸고 싶을 때: <div class="a2w-warn" data-label="꼭 확인"> */
.entry-content .a2w-warn[data-label]::before { content: attr(data-label); }

/* ==========================================================================
   2) 팁 박스 .a2w-tip  — 주의와 다른 색(시안 계열)
   ========================================================================== */
.entry-content .a2w-tip {
  border-left: 5px solid var(--global-palette12);
  background: var(--a2w-tip-bg);
  border-radius: 0 8px 8px 0;
  padding: 20px 22px;
}
.entry-content .a2w-tip > *:first-child { margin-top: 0; }
.entry-content .a2w-tip > *:last-child { margin-bottom: 0; }
.entry-content .a2w-tip::before {
  content: "팁";
  display: block; margin-bottom: 10px;
  font-size: 12.5px; font-weight: 800; letter-spacing: .08em;
  color: var(--global-palette12);
}
.entry-content .a2w-tip[data-label]::before { content: attr(data-label); }

/* ==========================================================================
   3) 비교 2단 .a2w-compare  — core/columns 에 클래스만 붙인다
   ========================================================================== */
.entry-content .a2w-compare {
  display: grid; grid-template-columns: 1fr; gap: 14px;
  /* 코어 columns 의 기본 flex 를 덮는다 */
}
.entry-content .a2w-compare > .wp-block-column,
.entry-content .a2w-compare > div {
  margin: 0; flex-basis: auto !important;
  border: 1px solid var(--a2w-line); border-radius: 10px;
  background: #FFFFFF; padding: 20px 20px 22px;
  /* grid/flex 자식은 기본 min-width 가 auto 라, 안에 긴 코드 한 줄이 있으면
     칸이 그만큼 부풀어 페이지 전체가 가로로 넘친다. 0 으로 눌러야 한다. */
  min-width: 0;
}
/* 칸이 좁으므로 안의 코드는 스크롤 대신 줄바꿈시킨다.
   복사해서 쓸 명령어인데 잘려 보이면 안 된다. */
.entry-content .a2w-compare pre,
.entry-content .a2w-compare .wp-block-code {
  max-width: 100%; overflow-x: auto;
  white-space: pre-wrap; overflow-wrap: anywhere;
}
.entry-content .a2w-compare > * > *:first-child { margin-top: 0; }
.entry-content .a2w-compare > * > *:last-child { margin-bottom: 0; }
/* 각 칸의 첫 제목을 머리글처럼 */
.entry-content .a2w-compare h3,
.entry-content .a2w-compare h4 {
  font-size: 17px; line-height: 1.45; font-weight: 800; color: var(--global-palette3);
  margin: 0 0 12px; padding: 0 0 10px; border-bottom: 1px solid var(--a2w-line-soft);
  border-top: 0;   /* 본문 h2 의 윗선 규칙이 끼어들지 않게 */
}
.entry-content .a2w-compare p,
.entry-content .a2w-compare li { font-size: 16px; line-height: 1.7; }
/* 왼쪽 칸은 포인트색, 오른쪽 칸은 시안색으로 살짝 구분 */
.entry-content .a2w-compare > *:first-child { border-top: 3px solid var(--global-palette1); }
.entry-content .a2w-compare > *:nth-child(2) { border-top: 3px solid var(--global-palette12); }

/* ==========================================================================
   4) 단계 흐름도 .a2w-flow  — core/list 에 클래스만 붙인다
   ========================================================================== */
.entry-content ol.a2w-flow,
.entry-content ul.a2w-flow {
  list-style: none; margin-left: 0; padding-left: 0; counter-reset: a2wflow;
}
.entry-content .a2w-flow > li {
  position: relative; counter-increment: a2wflow;
  padding: 16px 18px 16px 58px;
  border: 1px solid var(--a2w-line); border-radius: 10px; background: #FFFFFF;
  font-size: 16.5px; line-height: 1.7; color: var(--global-palette4);
  margin: 0 0 34px;
}
.entry-content .a2w-flow > li:last-child { margin-bottom: 0; }
/* 번호 원 */
.entry-content .a2w-flow > li::before {
  content: counter(a2wflow);
  position: absolute; left: 16px; top: 15px;
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--global-palette1); color: #FFFFFF;
  font-family: var(--a2w-mono); font-size: 13px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
/* 아래로 잇는 화살표 */
.entry-content .a2w-flow > li:not(:last-child)::after {
  content: ""; position: absolute; left: 29px; bottom: -30px;
  width: 2px; height: 26px; background: var(--a2w-line-blue);
  box-shadow: -4px -8px 0 -3px var(--a2w-line-blue), 4px -8px 0 -3px var(--a2w-line-blue);
}
.entry-content .a2w-flow > li strong { color: var(--global-palette3); }

/* ==========================================================================
   5) 체크리스트 .a2w-check  — core/list 에 클래스만 붙인다
   ========================================================================== */
.entry-content ul.a2w-check,
.entry-content ol.a2w-check {
  list-style: none; margin-left: 0; padding-left: 0;
  border: 1px solid var(--a2w-line); border-radius: 10px; background: #FFFFFF;
  padding: 8px 20px;
}
.entry-content .a2w-check > li {
  position: relative; padding: 12px 0 12px 32px; margin: 0;
  font-size: 16.5px; line-height: 1.7; color: var(--global-palette4);
  border-bottom: 1px solid var(--a2w-line-soft);
}
.entry-content .a2w-check > li:last-child { border-bottom: 0; }
.entry-content .a2w-check > li::before {
  content: ""; position: absolute; left: 2px; top: 19px;
  width: 16px; height: 16px; border-radius: 4px;
  border: 2px solid var(--global-palette1); background: #FFFFFF;
}
.entry-content .a2w-check > li::after {
  content: ""; position: absolute; left: 7px; top: 22px;
  width: 5px; height: 9px; border: solid var(--global-palette1);
  border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.entry-content .a2w-check > li strong { color: var(--global-palette3); }

/* ==========================================================================
   6) 프롬프트 박스 .a2w-prompt  — core/code 에 클래스만 붙인다
   JS 가 없어도 박스와 라벨은 그대로 보인다. 복사 버튼만 JS 가 붙인다.
   ========================================================================== */
.entry-content pre.a2w-prompt,
.entry-content .a2w-prompt {
  position: relative;
  background: var(--a2w-code-bg); color: var(--a2w-code-fg);
  border: 1px solid var(--a2w-navy-line); border-radius: 10px;
  padding: 46px 20px 20px;
  font-family: var(--a2w-mono); font-size: 14.5px; line-height: 1.85;
  white-space: pre-wrap; word-break: normal; overflow-wrap: anywhere;
  overflow-x: auto;
}
.entry-content .a2w-prompt::before {
  content: "PROMPT";
  position: absolute; left: 20px; top: 15px;
  font-family: var(--a2w-mono); font-size: 11px; font-weight: 800;
  letter-spacing: .2em; color: #FFFFFF;
}
.entry-content .a2w-prompt[data-label]::before { content: attr(data-label); }
.entry-content .a2w-prompt code {
  background: none; padding: 0; color: inherit; font-family: inherit; font-size: inherit;
}
/* 바꿔 쓸 자리 표시 */
.entry-content .a2w-prompt mark {
  background: rgba(147,180,224,.20); color: #DCE7F7; border-radius: 3px; padding: 0 4px;
}

/* JS 가 붙이는 복사 버튼 */
.a2w-prompt__copy {
  position: absolute; right: 14px; top: 11px;
  border: 1px solid var(--a2w-navy-link); background: transparent; color: var(--a2w-navy-link);
  font-size: 12px; font-weight: 700; padding: 5px 13px; border-radius: 6px; cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.a2w-prompt__copy:hover { background: var(--a2w-navy-link); color: var(--a2w-code-bg); }
.a2w-prompt__copy.is-done {
  border-color: var(--global-palette12); background: var(--global-palette12); color: #FFFFFF;
}

/* 프롬프트 아래 "어떻게 고쳐 쓰나" 설명 패널 */
.entry-content .a2w-prompt-how {
  margin-top: -22px;                      /* 프롬프트 박스에 붙여 놓는다 */
  background: var(--global-palette7); border: 1px solid var(--a2w-line);
  border-radius: 0 0 10px 10px; padding: 18px 20px;
}
.entry-content .a2w-prompt-how > *:first-child { margin-top: 0; }
.entry-content .a2w-prompt-how > *:last-child { margin-bottom: 0; }
.entry-content .a2w-prompt-how::before {
  content: "어떻게 고쳐 쓰나요?";
  display: block; margin-bottom: 10px;
  font-size: 13px; font-weight: 800; color: var(--global-palette3);
}
.entry-content .a2w-prompt-how[data-label]::before { content: attr(data-label); }
.entry-content .a2w-prompt-how p,
.entry-content .a2w-prompt-how li { font-size: 15.5px; line-height: 1.75; color: var(--global-palette5); }

/* ==========================================================================
   컴포넌트 반응형 — 390px 에서 안 깨지게
   ========================================================================== */
@media (min-width: 640px) {
  .entry-content .a2w-compare { grid-template-columns: 1fr 1fr; gap: 18px; }
}

@media (max-width: 639px) {
  .entry-content .a2w-warn,
  .entry-content .a2w-tip { padding: 17px 18px; }
  .entry-content .a2w-compare > .wp-block-column,
  .entry-content .a2w-compare > div { padding: 17px 17px 19px; }
  .entry-content .a2w-flow > li { padding: 14px 15px 14px 52px; font-size: 16px; }
  .entry-content .a2w-flow > li::before { left: 13px; top: 13px; width: 26px; height: 26px; font-size: 12.5px; }
  .entry-content .a2w-flow > li:not(:last-child)::after { left: 25px; }
  .entry-content .a2w-check { padding: 6px 16px; }
  .entry-content .a2w-check > li { font-size: 16px; padding-left: 30px; }
  .entry-content pre.a2w-prompt,
  .entry-content .a2w-prompt { font-size: 13.5px; padding: 44px 15px 17px; }
  .a2w-prompt__copy { right: 10px; top: 9px; padding: 4px 10px; font-size: 11.5px; }
  .entry-content .a2w-prompt-how { padding: 16px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .a2w-prompt__copy { transition: none; }
}

/* ==========================================================================
   A2W V7 · DEPLOY 1 — Header/Hero 딥네이비 + Hero 이미지 3장
   2026-08-30 (히어로 전용 이미지 자산 교체 반영본)

   되돌리기: 이 주석부터 파일 끝까지 삭제
             또는 cp /a2work/a2w.css.pre-v7 <테마>/assets/a2w.css
   앞쪽 기존 규칙은 한 줄도 수정하지 않았다.
   ========================================================================== */
:root{
  --a2w-navy:#07111F;
  --a2w-navy-img:#010312;
  --a2w-cyan:#5FD3E8;
  --a2w-onnavy:#FFFFFF;
  --a2w-onnavy2:#C9D6E6;
  --a2w-onnavy3:#8296B0;
}

/* ---- Header : Kadence 기본 흰 배경을 네이비로. Hero 와 한 덩어리로 ---- */
#masthead .site-header-wrap,
#masthead .site-mobile-header-wrap{ background-color:var(--a2w-navy); }
#masthead .site-header-row-container-inner,
#masthead .site-main-header-wrap{ background:transparent; }
#masthead{ box-shadow:none; border-bottom:0; }
#masthead .site-header-inner-wrap{ border-bottom:0; }
#masthead .header-navigation .menu > li > a{ color:var(--a2w-onnavy2); }
#masthead .header-navigation .menu > li > a:hover,
#masthead .header-navigation .menu > li.current-menu-item > a,
#masthead .header-navigation .menu > li.current-menu-parent > a,
#masthead .header-navigation .menu > li.current-menu-ancestor > a{ color:var(--a2w-onnavy); }
#masthead .menu-toggle-open,
#masthead .menu-toggle-open .menu-toggle-icon,
#masthead .drawer-toggle,
#masthead .search-toggle-open{ color:var(--a2w-onnavy); }
/* 로고 원본이 짙은 남색이라 네이비에서 묻힌다. 밝은 로고가 오면 이 줄만 지운다 */
#masthead .custom-logo{ filter:brightness(1.45) saturate(1.12); }

/* ---- Hero 배경 ---- */
.a2w-hero{
  background:
    radial-gradient(760px 620px at 78% 50%,
      var(--a2w-navy-img) 0%, var(--a2w-navy-img) 42%, rgba(1,3,18,0) 82%),
    radial-gradient(900px 520px at 76% 46%, rgba(52,170,220,.24), transparent 62%),
    radial-gradient(700px 460px at 16% 8%, rgba(30,90,170,.30), transparent 60%),
    linear-gradient(160deg,#0A1729 0%,#0B1A2E 45%,#07111F 100%);
  border-bottom:0;
  overflow:hidden;
}
.a2w-hero::before,
.a2w-hero::after{ display:none; }
.a2w-hero .a2w-motif,
.a2w-hero .a2w-wire{ display:none; }

/* ---- Hero 카피 — 세 슬라이드 위계를 같게 ---- */
.a2w-hero .a2w-slide .a2w-hero__title{ color:var(--a2w-onnavy); margin:0 0 24px; }
.a2w-hero .a2w-slide p{ color:var(--a2w-onnavy2); }
.a2w-hero .a2w-slide__eyebrow{ color:var(--a2w-cyan); }
.a2w-hero .a2w-count{ color:var(--a2w-onnavy3); }
.a2w-hero .a2w-count b{ color:var(--a2w-cyan); }
.a2w-hero .a2w-dots button{ border-color:rgba(160,200,235,.42); background:transparent; }
.a2w-hero .a2w-dots button[aria-selected="true"]{ background:var(--a2w-cyan); border-color:var(--a2w-cyan); }
.a2w-hero .a2w-arrows button{ background:transparent; border-color:rgba(160,200,235,.34); color:var(--a2w-onnavy2); }
.a2w-hero .a2w-arrows button:hover{ border-color:var(--a2w-cyan); color:var(--a2w-cyan); }

/* --------------------------------------------------------------------------
   Hero 비주얼 슬롯

   이미지는 슬롯 전용으로 다시 잘라낸 자산이다(피사체가 프레임을 채운다).
   그래서 CSS 로 확대하지 않는다. object-fit:cover 로 채우기만 한다.
   테두리·그림자·배경·라운드·패딩을 전부 없애 프레임처럼 보이지 않게 한다.
   -------------------------------------------------------------------------- */
.a2w-hero .a2w-viz{
  display:block;
  position:relative;
  width:100%;
  min-height:0;
  aspect-ratio:1/1;
  overflow:hidden;
  background:transparent;
  border:0; outline:0; box-shadow:none; border-radius:0; padding:0;
}
.a2w-vizimg{
  position:absolute; inset:0;
  width:100%; height:100%;
  max-width:none; max-height:none;
  object-fit:cover;
  object-position:50% 50%;
  opacity:0;
  transition:opacity .75s ease;
  pointer-events:none;
}
.a2w-vizimg.is-active{ opacity:1; }

/* 왼쪽(카피 쪽)과 위아래만 배경으로 녹인다.
   오른쪽은 화면 밖으로 흘려보내서 경계 자체가 없다 */
.a2w-hero .a2w-viz::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(to right,  #010312 0%, rgba(1,3,18,.5) 8%, rgba(1,3,18,0) 22%),
    linear-gradient(to bottom, #010312 0%, rgba(1,3,18,0) 9%),
    linear-gradient(to top,    #010312 0%, rgba(1,3,18,0) 9%);
}

/* ---- 데스크톱 : 오른쪽을 화면 밖까지 흘려 full-bleed 로 보이게 ---- */
@media (min-width:900px){
  /* 비주얼을 그리드에서 빼내 히어로 오른쪽에 통째로 깐다.
     위·아래·오른쪽이 히어로 경계와 겹치므로 사각형 테두리가 아예 생기지 않는다.
     왼쪽만 배경으로 녹인다. */
  .a2w-hero{ position:relative; }
  /* inner 가 position:relative 라 절대배치 기준이 inner 가 된다.
     기준을 히어로로 옮겨야 이미지가 히어로 아래끝까지 채운다. */
  .a2w-hero .a2w-hero__inner{ grid-template-columns:1fr; position:static; }
  .a2w-hero .a2w-hero__copy{ position:relative; z-index:2; max-width:640px; }
  .a2w-hero .a2w-hero__ctrl{ position:relative; z-index:2; }

  .a2w-hero .a2w-viz{
    position:absolute; z-index:1;
    top:0; right:0; bottom:0; left:auto;
    width:58%;
    height:auto;
    aspect-ratio:auto;
    max-height:none;
  }
  .a2w-hero .a2w-viz::after{
    background:linear-gradient(to right,
      #010312 0%, rgba(1,3,18,.72) 12%, rgba(1,3,18,.28) 30%, rgba(1,3,18,0) 48%);
  }

  /* 세 슬라이드 모두 같은 크기·굵기·줄간격 */
  /* 2·3번 슬라이드는 <p class="a2w-hero__title"> 라서
     기존 `.a2w-slide p`(0,1,1) 가 제목 크기를 덮어썼다.
     선택자를 한 단계 더 좁혀 세 슬라이드를 같은 크기로 만든다. */
  .a2w-hero .a2w-slide .a2w-hero__title{ font-size:60px; line-height:1.2; font-weight:800; }
  .a2w-hero .a2w-slide p{ font-size:19.5px; line-height:1.8; max-width:24em; }
}

/* ---- 모바일 : 텍스트 아래, 콘텐츠 폭 100%. 숨기지 않는다 ---- */
@media (max-width:899px){
  .a2w-hero{
    background:
      radial-gradient(520px 460px at 50% 74%,
        var(--a2w-navy-img) 0%, var(--a2w-navy-img) 44%, rgba(1,3,18,0) 82%),
      radial-gradient(560px 420px at 60% 70%, rgba(52,170,220,.22), transparent 64%),
      radial-gradient(520px 380px at 10% 6%, rgba(30,90,170,.30), transparent 62%),
      linear-gradient(160deg,#0A1729 0%,#0B1A2E 45%,#07111F 100%);
  }
  .a2w-hero .a2w-viz{ width:100%; }
  .a2w-hero .a2w-viz::after{
    background:
      linear-gradient(to right,  #010312 0%, rgba(1,3,18,0) 9%),
      linear-gradient(to left,   #010312 0%, rgba(1,3,18,0) 9%),
      linear-gradient(to bottom, #010312 0%, rgba(1,3,18,0) 7%),
      linear-gradient(to top,    #010312 0%, rgba(1,3,18,0) 7%);
  }
}
@media (max-width:767px){
  .a2w-hero .a2w-slide .a2w-hero__title{ font-size:33px; line-height:1.3; font-weight:800; }
  .a2w-hero .a2w-slide p{ font-size:17px; line-height:1.8; }
}

@media (prefers-reduced-motion:reduce){
  .a2w-vizimg{ transition:none; }
}

/* ==========================================================================
   A2W · 1차 UI 복구 (2026-08-30)
   docs/home-v7 시안 기준으로 라이브에서 빠진 것만 되돌린다.
   Hero 는 손대지 않는다.

   되돌리기: 이 주석부터 파일 끝까지 삭제
   ========================================================================== */

/* --------------------------------------------------------------------------
   A. Header — 메뉴를 화면 정중앙에 고정
   Kadence 는 [좌 브랜딩][우 내비] 2단이라 메뉴가 오른쪽으로 밀린다.
   행을 1fr auto 1fr 그리드로 바꿔 내비를 가운데 칸에 놓는다.
   -------------------------------------------------------------------------- */
@media (min-width:1025px){
  #masthead .site-main-header-inner-wrap{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    width:100%;
  }
  #masthead .site-header-main-section-left{  grid-column:1; justify-self:start; }
  #masthead .site-header-main-section-right{ grid-column:2; justify-self:center; }
  #masthead .site-header-main-section-center{ display:none; }
  #masthead .header-navigation .menu{ justify-content:center; }
}

/* --------------------------------------------------------------------------
   B. START HERE — STEP 카드 아이콘 복구
   아이콘은 왼쪽 위, STEP 배지는 반대쪽(오른쪽 위).
   -------------------------------------------------------------------------- */
.a2w-step{
  display:grid;
  grid-template-columns:auto 1fr;
  column-gap:14px;
  row-gap:0;
  align-content:start;
}
.a2w-step__ic{
  grid-column:1; grid-row:1;
  width:44px; height:44px; border-radius:11px;
  display:grid; place-items:center;
  background:var(--a2w-bg2, #EDF2F9);
  color:var(--global-palette1);
  margin-bottom:14px;
}
.a2w-step__ic svg{ display:block; }
.a2w-step__n{
  grid-column:2; grid-row:1;
  justify-self:end; align-self:center;
  margin-bottom:14px;
}
.a2w-step h3{ grid-column:1 / -1; }
.a2w-step p{ grid-column:1 / -1; }
.a2w-step:hover .a2w-step__ic{ background:#FFFFFF; }

/* --------------------------------------------------------------------------
   C. Knowledge Directory — 목록이 아니라 카드로
   이미지 상단 / 흰 본문 / 우측 원형 화살표. 이미지·문구는 그대로.
   -------------------------------------------------------------------------- */
.a2w-dir{ border-top:0; gap:24px; }
.a2w-dir__item{
  background:#FFFFFF;
  border:1px solid var(--a2w-line);
  border-radius:12px;
  overflow:hidden;
  padding:0;
  border-bottom:1px solid var(--a2w-line);
  transition:border-color .18s, box-shadow .18s, transform .18s;
}
.a2w-dir__item:hover{
  border-color:#C3D4E8;
  box-shadow:0 14px 30px rgba(16,40,74,.13);
  transform:translateY(-3px);
}
.a2w-dir__item::after{ content:none; }          /* 기존 텍스트 화살표 제거 */
.a2w-dir__thumb{ margin:0; display:block; overflow:hidden; }
.a2w-dir__thumb .a2w-img{
  width:100%; height:auto; display:block;
  aspect-ratio:16/9; object-fit:cover;
  border:0; border-radius:0;
  transition:transform .35s;
}
.a2w-dir__item:hover .a2w-img{ transform:scale(1.04); }
.a2w-dir__label{ margin:0 0 8px; }
.a2w-dir__item > .a2w-dir__label,
.a2w-dir__item > h3,
.a2w-dir__item > p{ padding-left:18px; padding-right:64px; }
.a2w-dir__item > .a2w-dir__label{ padding-top:18px; }
.a2w-dir__item > p{ padding-bottom:20px; }
.a2w-dir__go{
  position:absolute; right:18px; bottom:22px;
  width:34px; height:34px; border-radius:50%;
  border:1px solid var(--a2w-line);
  background:var(--a2w-bg2, #EDF2F9);
  display:grid; place-items:center;
  color:var(--global-palette1);
  transition:.18s;
}
.a2w-dir__item:hover .a2w-dir__go{
  background:var(--global-palette1);
  border-color:var(--global-palette1);
  color:#FFFFFF;
}

/* --------------------------------------------------------------------------
   D. 최신 가이드 — editorial featured card
   글이 1개면 카드 하나만. 폭을 다 차지하지 않게 58% 로 둔다.
   글이 늘면 오른쪽 칸에 자동으로 이어 붙는다.
   -------------------------------------------------------------------------- */
.a2w-guide .wp-block-post-template{ border-top:0; gap:24px; }
.a2w-guide .wp-block-post-template > li{
  background:#FFFFFF;
  border:1px solid var(--a2w-line);
  border-radius:12px;
  overflow:hidden;
  padding:0;
  border-bottom:1px solid var(--a2w-line);
}
.a2w-guide .wp-block-post-featured-image{ margin:0; }
.a2w-guide .wp-block-post-featured-image img{
  width:100%; height:auto; display:block;
  aspect-ratio:16/9; object-fit:cover;
  border:0; border-radius:0;
}
.a2w-guide .wp-block-post-terms,
.a2w-guide .wp-block-post-title,
.a2w-guide .wp-block-post-excerpt,
.a2w-guide .wp-block-post-date{ padding-left:20px; padding-right:20px; }
.a2w-guide .wp-block-post-terms{ padding-top:18px; }
.a2w-guide .wp-block-post-title{ margin:8px 0 8px; }
.a2w-guide .wp-block-post-date{ padding-bottom:20px; }

/* --------------------------------------------------------------------------
   E. AI 최신 소식 — 가로형 카드. 데이터가 0이면 작은 empty state 만.
   -------------------------------------------------------------------------- */
.a2w-news .wp-block-post-template{
  border-top:0;
  display:grid; gap:20px;
  grid-template-columns:1fr;
}
.a2w-news .wp-block-post-template > li{
  background:#FFFFFF;
  border:1px solid var(--a2w-line);
  border-radius:12px;
  overflow:hidden;
  padding:0;
  border-bottom:1px solid var(--a2w-line);
}
.a2w-news .wp-block-post-featured-image{ margin:0; }
.a2w-news .wp-block-post-featured-image img{
  width:100%; height:auto; display:block;
  aspect-ratio:16/10; object-fit:cover; border:0; border-radius:0;
}
.a2w-news .wp-block-post-title,
.a2w-news .wp-block-post-date{ padding-left:16px; padding-right:16px; }
.a2w-news .wp-block-post-title{ padding-top:15px; }
.a2w-news .wp-block-post-date{ padding-bottom:17px; }

/* 빈 상태는 섹션을 다 먹지 않게 작게 */
.a2w-guide .a2w-empty,
.a2w-news .a2w-empty{
  max-width:520px;
  padding:20px 22px;
  text-align:left;
  border-radius:12px;
  background:rgba(255,255,255,.72);
}
.a2w-guide .a2w-empty p,
.a2w-news .a2w-empty p{ font-size:15px; }

/* --------------------------------------------------------------------------
   반응형
   -------------------------------------------------------------------------- */
@media (min-width:900px){
  .a2w-dir{ grid-template-columns:repeat(3,1fr); column-gap:24px; row-gap:24px; }
  .a2w-guide .wp-block-post-template{
    display:grid;
    /* 40px gap 때문에 % 로 잡으면 실제 폭이 52% 로 줄어든다. fr 로 맞춘다 */
    grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
    column-gap:36px; row-gap:24px;
    align-items:start;
  }
  .a2w-news .wp-block-post-template{ grid-template-columns:repeat(4,1fr); }
}

@media (max-width:899px){
  .a2w-dir{ grid-template-columns:1fr; gap:16px; }
  .a2w-guide .wp-block-post-template{ grid-template-columns:1fr; }
  .a2w-news .wp-block-post-template{ grid-template-columns:1fr; }
  .a2w-step__ic{ width:40px; height:40px; }
}

/* ==========================================================================
   A2W · 카테고리 허브 (2026-08-30)
   category.php 가 켠 카테고리에서만 쓰는 레이아웃.
   Home / Hero / 글 본문 CSS 는 건드리지 않는다.

   되돌리기: 이 주석부터 파일 끝까지 삭제
   ========================================================================== */

.a2w-cat{ word-break:keep-all; }

/* --------------------------------------------------------------------------
   1. Category Hero — 홈 히어로처럼 크거나 어둡게 만들지 않는다
   -------------------------------------------------------------------------- */
.a2w-cathero{
  background:linear-gradient(140deg,#F2F6FC 0%,#E8EFF8 55%,#E2EBF6 100%);
  border-bottom:1px solid var(--a2w-line-blue, #DCE6F2);
  position:relative;
  overflow:hidden;
}
.a2w-cathero::after{   /* 아주 절제된 cyan accent */
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:linear-gradient(90deg, var(--global-palette1,#1D4E89), #5FD3E8 42%, transparent 78%);
}
.a2w-cathero__in{
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
  align-items:center;
  /* 가로 여백은 .a2w-wrap 이 소유한다(L87 / L338). 여기서는 세로만 정한다.
     padding 단축을 쓰면 .a2w-wrap 의 좌우 패딩이 0 으로 덮인다. 2026-09-01 */
  padding-top:38px;
  padding-bottom:40px;
}
.a2w-cathero__txt{ min-width:0; }
.a2w-cathero__title{
  font-size:30px; line-height:1.28; font-weight:800;
  letter-spacing:-.02em; color:var(--global-palette3);
  margin:10px 0 12px;
}
.a2w-cathero__desc{
  font-size:16px; line-height:1.8; color:var(--global-palette5);
  margin:0; max-width:34em;
}
.a2w-cathero__img{
  border-radius:14px; overflow:hidden;
  box-shadow:0 12px 30px rgba(16,40,74,.14);
  line-height:0;
}
.a2w-cathero__img img{
  width:100%; height:auto; display:block;
  aspect-ratio:16/9; object-fit:cover;
}

/* --------------------------------------------------------------------------
   공통 — 이미지가 없는 글의 기본 면
   -------------------------------------------------------------------------- */
.a2w-fallback{
  display:grid; place-items:center;
  width:100%; height:100%;
  background:linear-gradient(140deg,#EDF2F9 0%,#E1EAF5 100%);
}
.a2w-fallback b{
  font-family:var(--a2w-mono, monospace);
  font-size:20px; font-weight:800; letter-spacing:.14em;
  color:#9DB0C8;
}

/* --------------------------------------------------------------------------
   2. START HERE — 가로형 editorial card
   -------------------------------------------------------------------------- */
.a2w-feat{
  display:grid;
  grid-template-columns:1fr;
  text-decoration:none;
  background:#FFFFFF;
  border:1px solid var(--a2w-line);
  border-radius:14px;
  overflow:hidden;
  transition:border-color .18s, box-shadow .18s, transform .18s;
}
.a2w-feat:hover{
  border-color:#C3D4E8;
  box-shadow:0 14px 32px rgba(16,40,74,.13);
  transform:translateY(-2px);
}
.a2w-feat__img{ display:block; line-height:0; overflow:hidden; background:#EDF2F9; }
.a2w-feat__img img{
  width:100%; height:100%; display:block;
  aspect-ratio:16/9; object-fit:cover;
}
.a2w-feat__body{
  display:block; padding:22px 24px 24px;
}
.a2w-feat__badge{
  display:inline-block;
  font-family:var(--a2w-mono, monospace);
  font-size:10.5px; font-weight:700; letter-spacing:.16em;
  color:var(--global-palette12);
  margin-bottom:10px;
}
.a2w-feat__title{
  font-size:22px; line-height:1.45; font-weight:800;
  letter-spacing:-.02em; color:var(--global-palette3);
  margin:0 0 10px;
}
.a2w-feat:hover .a2w-feat__title{ color:var(--global-palette1); }
.a2w-feat__ex{
  font-size:15.5px; line-height:1.8; color:var(--global-palette5);
  margin:0 0 16px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.a2w-feat__meta{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  font-size:13.5px; color:var(--global-palette6);
}
.a2w-feat__go{
  width:34px; height:34px; border-radius:50%; flex:none;
  border:1px solid var(--a2w-line);
  background:#EDF2F9;
  display:grid; place-items:center;
  color:var(--global-palette1);
  transition:.18s;
}
.a2w-feat:hover .a2w-feat__go{
  background:var(--global-palette1); border-color:var(--global-palette1); color:#FFFFFF;
}

/* --------------------------------------------------------------------------
   3·4. 카드 그리드 — 인기 글 / 최신 글이 같은 컴포넌트를 쓴다
   -------------------------------------------------------------------------- */
.a2w-cards{
  display:grid;
  grid-template-columns:1fr;
  gap:22px;
  align-items:stretch;
}
.a2w-card{
  display:flex; flex-direction:column;
  text-decoration:none;
  background:#FFFFFF;
  border:1px solid var(--a2w-line);
  border-radius:12px;
  overflow:hidden;
  height:100%;
  transition:border-color .18s, box-shadow .18s, transform .18s;
}
.a2w-card:hover{
  border-color:#C3D4E8;
  box-shadow:0 14px 30px rgba(16,40,74,.13);
  transform:translateY(-3px);
}
.a2w-card__img{ display:block; line-height:0; overflow:hidden; background:#EDF2F9; aspect-ratio:16/9; }
.a2w-card__img img{
  width:100%; height:100%; display:block;
  object-fit:cover; transition:transform .35s;
}
.a2w-card:hover .a2w-card__img img{ transform:scale(1.04); }
.a2w-card__body{
  display:flex; flex-direction:column; flex:1 1 auto;
  padding:16px 18px 18px;
}
.a2w-card__badge{
  display:block;
  font-family:var(--a2w-mono, monospace);
  font-size:10px; font-weight:700; letter-spacing:.16em;
  color:var(--global-palette12);
  margin-bottom:8px;
}
.a2w-card__title{
  font-size:17px; line-height:1.5; font-weight:700;
  letter-spacing:-.02em; color:var(--global-palette3);
  margin:0 0 8px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.a2w-card:hover .a2w-card__title{ color:var(--global-palette1); }
.a2w-card__ex{
  font-size:14.5px; line-height:1.7; color:var(--global-palette6);
  margin:0 0 14px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.a2w-card__meta{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-top:auto;
  font-size:13px; color:var(--global-palette6);
}
.a2w-card__go{
  width:30px; height:30px; border-radius:50%; flex:none;
  border:1px solid var(--a2w-line);
  background:#EDF2F9;
  display:grid; place-items:center;
  color:var(--global-palette1);
  transition:.18s;
}
.a2w-card:hover .a2w-card__go{
  background:var(--global-palette1); border-color:var(--global-palette1); color:#FFFFFF;
}

/* --------------------------------------------------------------------------
   페이지네이션 — 워드프레스 기본 구조를 그대로 쓰고 모양만 맞춘다
   -------------------------------------------------------------------------- */
.a2w-cat .pagination{ margin-top:36px; }
.a2w-cat .nav-links{
  display:flex; flex-wrap:wrap; gap:8px; justify-content:center; align-items:center;
}
.a2w-cat .nav-links .page-numbers{
  min-width:40px; height:40px; padding:0 12px;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--a2w-line); border-radius:8px;
  background:#FFFFFF; color:var(--global-palette5);
  font-size:14.5px; font-weight:600; text-decoration:none;
}
.a2w-cat .nav-links .page-numbers:hover{ border-color:var(--global-palette1); color:var(--global-palette1); }
.a2w-cat .nav-links .page-numbers.current{
  background:var(--global-palette1); border-color:var(--global-palette1); color:#FFFFFF;
}
.a2w-cat .nav-links .page-numbers.dots{ border-color:transparent; background:transparent; }

.a2w-cat .a2w-empty{ max-width:560px; }

/* --------------------------------------------------------------------------
   반응형
   -------------------------------------------------------------------------- */
@media (min-width:768px){
  .a2w-cards{ grid-template-columns:repeat(2,1fr); }
  .a2w-feat{ grid-template-columns:minmax(0,46%) minmax(0,54%); align-items:stretch; }
  /* height:100% + aspect-ratio:auto 를 같이 쓰면 서로를 참조해 이미지가 부푼다.
     절대배치로 순환을 끊는다. 칸 높이는 오른쪽 본문이 정한다. */
  .a2w-feat__img{ position:relative; aspect-ratio:auto; height:100%; min-height:240px; }
  .a2w-feat__img img{
    position:absolute; inset:0;
    width:100%; height:100%;
    aspect-ratio:auto; object-fit:cover;
  }
  .a2w-feat__body{ padding:26px 28px; align-self:center; }
}

@media (min-width:900px){
  .a2w-cathero__in{
    grid-template-columns:minmax(0,54%) minmax(0,46%);
    gap:44px;
    padding-top:52px;
    padding-bottom:54px;
    min-height:280px;
  }
  .a2w-cathero__title{ font-size:38px; }
}

@media (min-width:1200px){
  .a2w-cards{ grid-template-columns:repeat(4,1fr); gap:24px; }
  .a2w-card__title{ font-size:16.5px; }
  .a2w-card__ex{ font-size:14px; }
}

@media (max-width:767px){
  /* 텍스트 -> 이미지 순서. 이미지는 콘텐츠 폭 100% */
  .a2w-cathero__in{ padding-top:30px; padding-bottom:32px; }
  .a2w-cathero__title{ font-size:26px; }
  .a2w-cathero__desc{ font-size:15.5px; }
  .a2w-feat__title{ font-size:19px; }
  .a2w-feat__body{ padding:18px 18px 20px; }
  .a2w-cards{ gap:16px; }
}

/* ==========================================================================
   A2W RESPONSIVE PATCH · 2026-09-01
   목적 두 가지만 다룬다.
     1) 모바일·태블릿에서 대표이미지가 콘텐츠 컨테이너 폭을 넘는 것
     2) .site.wp-site-blocks{overflow-x:clip} 때문에 넓은 본문 요소가
        스크롤 없이 조용히 잘리는 것
   Kadence 부모테마·전역 구조는 건드리지 않는다.
   기존 소유자가 있는 규칙(.wp-block-table / pre 의 overflow-x)은 재정의하지 않는다.
   ========================================================================== */

/* --- 1. 대표이미지 오버플로 (≤1024px 에서만. 데스크톱 원본 유지) ---------
   Kadence 가 .post-thumbnail 에 margin -27.75px 을 줘서 박스 밖으로 빼낸다.
   컨테이너 좌우 패딩은 24px 이라 3.75px 씩 화면 밖으로 나간다.
   모바일·태블릿에서는 본문 열과 같은 폭을 쓰게 되돌린다. */
@media (max-width: 1024px) {
  .single .content-wrap > .post-thumbnail {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
}

/* --- 2. 본문 넓은 요소 방어 -----------------------------------------------
   페이지 전체에 가로 스크롤을 만들지 않는다.
   넘치는 요소 안에서만 스크롤이 생기게 한다. */

/* 2-1 raw <table> fallback.
   figure.wp-block-table 로 감싼 표는 이미 296행이 담당하므로 건드리지 않는다.
   여기서는 그 래퍼가 없는 표만 대상으로 한다. */
.entry-content > table,
.entry-content > div > table,
.entry-content > figure:not(.wp-block-table) > table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* 2-2 iframe · embed · object · video 는 컨테이너를 넘지 않는다.
   height 는 건드리지 않는다. 비율은 각 블록이 알아서 한다. */
.entry-content iframe,
.entry-content embed,
.entry-content object,
.entry-content video {
  max-width: 100%;
}

/* 2-3 구텐베르크 임베드 래퍼 */
.entry-content .wp-block-embed__wrapper > iframe {
  max-width: 100%;
}

/* 2-4 마지막 안전망.
   위에서 다루지 못한 넓은 요소가 들어와도 화면 밖으로 나가지 않게 한다.
   alignfull / alignwide 는 의도적으로 넓은 것이므로 제외한다. */
/* .a2w-cathero 는 제외한다. 상단 배너가 스스로 화면 폭 전체로 넓어져야 하는데
   이 규칙(명시도 0,3,0)이 max-width:100% 로 그것을 막는다. 2026-09-02 */
.entry-content > *:not(.alignfull):not(.alignwide):not(.a2w-cathero) {
  max-width: 100%;
}

/* --- 3. 대표이미지 겹침 해제 (좁은 폭에서만) · 2026-09-01 ----------------
   Kadence 의 .kadence-thumbnail-position-behind 는 margin-bottom:-4.3em 으로
   본문 카드를 이미지 위로 끌어올린다(겹침 디자인).
   가림 높이는 73.1px 고정인데 이미지 높이는 폭에 비례한다.
     390px  73.1 / 217.6 = 33.6% 가려짐
     844px  73.1 / 519.8 = 14.1% 가려짐
   좁을수록 많이 가려져 이미지 하단 요소가 안 보인다.
   데스크톱(1025px 이상)의 겹침 디자인은 그대로 두고 좁은 폭에서만 푼다. */
@media (max-width: 1024px) {
  .kadence-thumbnail-position-behind { margin-bottom: 0; }
}

/* ==========================================================================
   A2W 읽기 편의 · 2026-09-01
     1) 맨 위로 버튼
     2) 상단 메뉴 고정 — 데스크톱만. 모바일은 결정 대기
   ========================================================================== */

/* --- 1. 맨 위로 버튼 -------------------------------------------------------
   --a2w-bottom-safe : 하단에 비워 둘 높이.
   지금은 0 이지만 AdSense 하단 앵커 광고가 붙으면 이 값만 키운다.
   버튼 위치 계산이 한 곳에만 있으므로 그때 JS·마크업을 건드릴 일이 없다. */
:root { --a2w-bottom-safe: 0px; }

.a2w-top {
  position: fixed;
  right: 20px;
  bottom: calc(20px + var(--a2w-bottom-safe));
  z-index: 400;                 /* 헤더(500)보다 아래, 본문보다 위 */

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;

  width: 60px;                  /* 40~50대 기준. 손가락 표적을 크게 잡는다 */
  height: 60px;
  padding: 0;
  border: 1px solid var(--a2w-line-blue);
  border-radius: 50%;
  background: rgba(255,255,255,.96);
  color: var(--global-palette3);
  box-shadow: 0 4px 14px rgba(15,27,46,.16);
  cursor: pointer;

  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .22s ease, transform .22s ease, visibility .22s;
}
.a2w-top.is-on { opacity: 1; visibility: visible; transform: translateY(0); }
.a2w-top:hover { border-color: var(--global-palette1); color: var(--global-palette1); }
.a2w-top:focus-visible { outline: 3px solid var(--global-palette1); outline-offset: 2px; }

.a2w-top__arrow {
  width: 11px; height: 11px;
  border-left: 2.5px solid currentColor;
  border-top: 2.5px solid currentColor;
  transform: rotate(45deg);
  margin-top: 3px;
}
.a2w-top__label { font-size: 10.5px; font-weight: 700; line-height: 1; letter-spacing: -.02em; }

@media (max-width: 767px) {
  .a2w-top { right: 14px; bottom: calc(14px + var(--a2w-bottom-safe)); }
}
@media (prefers-reduced-motion: reduce) {
  .a2w-top { transition: none; transform: none; }
  .a2w-top.is-on { transform: none; }
}

/* --- 2. 상단 메뉴 고정 (데스크톱만) ----------------------------------------
   모바일 고정 여부는 아직 정해지지 않았다. 정해지면 이 블록에 추가한다.
   Kadence 에 header_sticky 옵션이 있지만 그것은 데스크톱·모바일을 함께 켠다.
   지금은 데스크톱만 필요하므로 CSS 로 둔다. */
@media (min-width: 1025px) {
  #masthead { position: sticky; top: 0; z-index: 500; }
  .admin-bar #masthead { top: 32px; }   /* 로그인 시 관리바 높이만큼 내린다 */
}

/* ==========================================================================
   A2W 문의 폼 · 2026-09-02
   /contact/ 의 [a2w_inquiry_form] 이 쓰는 스타일.
   40~50대 기준 — 라벨을 크게, 입력칸을 높게, 표적을 넉넉히 잡는다.
   ========================================================================== */

.a2w-inq { max-width: 640px; margin: 0; }

.a2w-inq__row { display: block; margin: 0 0 22px; }

.a2w-inq label {
  display: block;
  font-size: 17px;
  font-weight: 700;
  color: var(--global-palette3);
  margin: 0 0 8px;
}

.a2w-inq__opt { font-weight: 400; font-size: 15px; color: var(--global-palette6); }

.a2w-inq input[type="text"],
.a2w-inq select,
.a2w-inq textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 13px 14px;
  font-size: 17px;              /* 모바일에서 자동 확대되지 않는 최소 크기 */
  line-height: 1.6;
  color: var(--global-palette3);
  background: #fff;
  border: 1px solid var(--a2w-line-blue);
  border-radius: 6px;
  box-sizing: border-box;
}

.a2w-inq textarea { resize: vertical; min-height: 132px; }

.a2w-inq input[type="text"]:focus,
.a2w-inq select:focus,
.a2w-inq textarea:focus {
  outline: 3px solid var(--global-palette1);
  outline-offset: 1px;
  border-color: var(--global-palette1);
}

.a2w-inq__help {
  display: block;
  margin-top: 7px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--global-palette6);
}

.a2w-inq__submit { margin: 28px 0 0; }

.a2w-inq button[type="submit"] {
  display: block;
  width: 100%;                  /* 폼 폭에 맞춘다. 위 입력칸들과 왼쪽·오른쪽이 일치한다 */
  padding: 16px 30px;           /* 손가락 표적을 크게 */
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  background: var(--global-palette1);
  border: 0;
  border-radius: 6px;
  cursor: pointer;
}
.a2w-inq button[type="submit"]:hover { background: var(--global-palette2); }
.a2w-inq button[type="submit"]:focus-visible { outline: 3px solid var(--global-palette3); outline-offset: 2px; }

/* 접수 완료 / 오류 안내 */
.a2w-inq__ok,
.a2w-inq__err {
  margin: 0 0 24px;
  padding: 15px 18px;
  border-radius: 6px;
  font-size: 17px;
  line-height: 1.7;
}
.a2w-inq__ok  { background: #EAF6EE; border: 1px solid #9CCFAE; color: #1E5B33; }
.a2w-inq__err { background: #FDECEC; border: 1px solid #E3A3A3; color: #8A2020; }

/* 허니팟 — 사람에게 보이지 않게. display:none 은 일부 봇이 알아채므로 화면 밖으로 뺀다.
   스크린리더에도 읽히지 않게 aria-hidden 을 마크업에서 함께 준다. */
.a2w-inq__hp {
  position: absolute !important;
  left: -9999px !important;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}


/* ==========================================================================
   A2W 문의 — 접수 완료 화면 · 2026-09-02
   ========================================================================== */


/* --- 접수 완료 화면 -------------------------------------------------------- */
.a2w-inq-done {
  max-width: 640px;
  margin: 0;
  padding: 40px 28px 34px;
  text-align: center;
  background: #F7FAFC;
  border: 1px solid var(--a2w-line-blue);
  border-radius: 10px;
}

.a2w-inq-done__mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  margin: 0 auto 18px;
  font-size: 32px;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  background: #2E7D4F;
  border-radius: 50%;
}

.a2w-inq-done__title {
  margin: 0 0 14px;
  font-size: 26px;
  line-height: 1.4;
  font-weight: 800;
  color: var(--global-palette3);
}

.a2w-inq-done__lead {
  margin: 0 0 30px;
  font-size: 17px;
  line-height: 1.8;
  color: var(--global-palette5);
}

.a2w-inq-done__btns {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin: 0 0 22px;
}

.a2w-inq-btn {
  display: inline-block;
  min-width: 168px;
  padding: 15px 26px;          /* 손가락 표적을 크게 */
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  border-radius: 6px;
  border: 1px solid var(--global-palette1);
  color: var(--global-palette1);
  background: #fff;
}
.a2w-inq-btn:hover { background: #EEF4FB; }
.a2w-inq-btn:focus-visible { outline: 3px solid var(--global-palette3); outline-offset: 2px; }

.a2w-inq-btn--main { color: #fff; background: var(--global-palette1); }
.a2w-inq-btn--main:hover { background: var(--global-palette2); }

.a2w-inq-done__again { margin: 0; font-size: 16px; }
.a2w-inq-done__again a { color: var(--global-palette6); text-decoration: underline; }
.a2w-inq-done__again a:hover { color: var(--global-palette1); }

@media (max-width: 767px) {
  .a2w-inq-done { padding: 32px 18px 28px; }
  .a2w-inq-done__title { font-size: 23px; }
  .a2w-inq-done__btns { flex-direction: column; }
  .a2w-inq-btn { width: 100%; min-width: 0; }
}

/* ==========================================================================
   A2W 방문자용 문의 목록 · 2026-09-02
   /inquiries/ — 비밀번호를 정한 문의만 보인다. 이름·연락처·본문은 나오지 않는다.
   ========================================================================== */

.a2w-list { max-width: 720px; }

.a2w-list__empty {
  margin: 0 0 20px;
  padding: 28px 20px;
  text-align: center;
  font-size: 17px;
  color: var(--global-palette6);
  background: #F7FAFC;
  border: 1px solid var(--a2w-line-blue);
  border-radius: 8px;
}

.a2w-list__items { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--a2w-line); }
.a2w-list__item { margin: 0; border-bottom: 1px solid var(--a2w-line); }

.a2w-list__link {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 16px 6px;          /* 손가락 표적을 넉넉히 */
  text-decoration: none;
  color: var(--global-palette3);
}
.a2w-list__link:hover { background: #F4F8FC; }
.a2w-list__link:focus-visible { outline: 3px solid var(--global-palette1); outline-offset: -3px; }

/* 한 줄에 종류 · 상태 · 날짜. 줄마다 세로로 열이 맞아야 훑어보기 쉽다.
   그래서 앞 두 칸은 최소 폭을 주고, 날짜는 margin-left:auto 로 오른쪽 끝에 붙인다.
   2026-09-02 — 자물쇠 아이콘과 안내 문장은 뺐다. 세 가지만 남긴다. */
.a2w-list__kind {
  flex: 0 0 auto;
  min-width: 6.4em;
  font-size: 17px;
  font-weight: 700;
}
.a2w-list__date {
  flex: 0 0 auto;
  margin-left: auto;            /* 오른쪽 끝 */
  font-size: 15px;
  color: var(--global-palette6);
  font-variant-numeric: tabular-nums;   /* 숫자 폭을 고르게 */
}

.a2w-list__st {
  flex: 0 0 auto;
  min-width: 5.2em;
  text-align: center;
  padding: 4px 11px;
  border-radius: 11px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}

/* --- 잠금 해제 화면 --- */
.a2w-unlock__head {
  margin: 0 0 18px;
  font-size: 18px;
  font-weight: 700;
  color: var(--global-palette3);
}

.a2w-unlock { max-width: 360px; }
.a2w-unlock input[type="password"] {
  display: block;
  width: 100%;
  padding: 13px 14px;
  font-size: 20px;             /* 4자리라 크게. 모바일 자동 확대도 막는다 */
  letter-spacing: .4em;
  text-align: center;
  border: 1px solid var(--a2w-line-blue);
  border-radius: 6px;
  box-sizing: border-box;
}
.a2w-unlock label { display: block; font-size: 17px; font-weight: 700; margin: 0 0 8px; }
.a2w-unlock button[type="submit"] {
  min-width: 160px;
  padding: 15px 30px;
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  background: var(--global-palette1);
  border: 0;
  border-radius: 6px;
  cursor: pointer;
}
.a2w-unlock button[type="submit"]:hover { background: var(--global-palette2); }

/* --- 상세 --- */
.a2w-detail { max-width: 720px; }
.a2w-detail__meta { margin: 0 0 24px; font-size: 15px; color: var(--global-palette6); }
.a2w-detail__h { margin: 26px 0 10px; font-size: 18px; font-weight: 700; color: var(--global-palette3); }

.a2w-detail__box {
  padding: 18px 20px;
  font-size: 17px;
  line-height: 1.8;
  background: #F7FAFC;
  border: 1px solid var(--a2w-line-blue);
  border-radius: 8px;
}
.a2w-detail__box--reply { background: #EAF6EE; border-color: #9CCFAE; }
.a2w-detail__none { margin: 0; padding: 18px 20px; font-size: 17px; color: var(--global-palette6); background: #F7FAFC; border: 1px dashed var(--a2w-line-blue); border-radius: 8px; }

/* --- 문의 폼의 비밀번호 --- */
/* 다른 입력 항목과 같은 모양으로 둔다. 상자로 감싸지 않는다.
   문의 한 건 남기는 화면이다. 경고문처럼 보이면 안 된다. 2026-09-02 개정 */
/* .a2w-inq input[type="text"] (0,1,1) 가 max-width:100% 를 갖고 있다.
   클래스 하나(0,1,0)로는 진다. 셀렉터를 올려서 이긴다. 2026-09-02 실측 */
.a2w-inq input.a2w-inq__pw {
  max-width: 140px;             /* 숫자 4자리. 칸 폭이 곧 "얼마나 적는지" 를 알려준다 */
  font-size: 19px;
  letter-spacing: .3em;
  text-align: center;
}

/* ※ 줄 — 회색 작은 글씨 한 줄 */
.a2w-inq__note {
  display: block;
  margin-top: 7px;
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--global-palette6);
}

/* 「내가 보낸 문의 확인하기」 — 보내기 버튼 아래. 버튼 폭 안에서 가운데. */
/* 폭을 따로 정하지 않는다. 본문 안전망(.entry-content > *)이 max-width:100% 를
   강제하므로 폼도 링크도 같은 폭이 된다. 가운데 정렬만 하면 버튼 아래 중앙에 온다. */
.a2w-inq__tolist {
  margin: 18px 0 0;
  text-align: center;
  font-size: 16px;
}
.a2w-inq__tolist a {
  display: inline-block;
  padding: 8px 6px;             /* 손가락 표적 */
  color: var(--global-palette1);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.a2w-inq__tolist a:hover { color: var(--global-palette2); }

@media (max-width: 767px) {
  .a2w-unlock button[type="submit"] { width: 100%; }
}

/* ==========================================================================
   A2W 문의 — 상단 배너 · 2026-09-02 (개정)
   카테고리 히어로(.a2w-cathero)를 그대로 쓴다. 같은 모양을 두 벌 만들지 않는다.
   여기서 새로 정하는 것은 「본문 안에서 화면 폭 전체로 넓히는 것」 하나뿐이다.
   ========================================================================== */

/* 이 페이지에서 가로 여백과 최대폭의 주인은 .a2w-wrap 하나다.
   본문 칸(.entry-content)을 화면 폭 전체로 열어두고, 배너와 폼이 각자
   안에 .a2w-wrap 을 둔다. 둘이 같은 규칙을 쓰므로 어긋날 수가 없다.
   (전에는 배너만 vw 로 밀어냈고 폼은 테마 본문 칸을 써서 1280px 에서
    왼쪽이 171px 어긋났다. 2026-09-02 실측)

   테마가 폭을 정하던 세 곳을 이 페이지에서만 비운다.
     .content-container   max-width 842px + padding 24px
     .entry.content-bg    모바일에서 margin -16px
     .entry-content-wrap  padding 24px                            */
/* Kadence 는 head 에 인라인으로
     .content-width-narrow .content-container.site-container{max-width:var(--global-content-narrow-width)}
   를 넣는다. 명시도 0,3,0 이고 a2w.css 보다 뒤에 온다.
   그래서 .page-id-70 .content-container (0,2,0) 로는 진다.
   body 를 붙여 0,3,1 로 올린다. 2026-09-02 실측 */
body.a2w-inq-page .content-container.site-container { max-width: none; padding-left: 0; padding-right: 0; }
body.a2w-inq-page .entry.content-bg { margin-left: 0; margin-right: 0; }
body.a2w-inq-page .entry-content-wrap { padding-left: 0; padding-right: 0; }

.a2w-cathero--page { margin-bottom: 40px; }

/* 폼·완료 화면을 감싸는 껍데기.
   한 겹 더 감싸는 이유 — .a2w-wrap 이 본문 직계에 오면 안전망 규칙
   (.entry-content > *, 명시도 0,4,0)의 max-width:100% 가 1120px 제한을 덮는다.
   손자로 내리면 안전망이 닿지 않아 예외를 새로 만들 필요가 없다. */
.a2w-inq-body { margin: 0; }

/* 입력 폼은 배너처럼 넓게 쓰지 않는다. 한 줄이 길면 읽기 어렵다.
   왼쪽 선은 배너와 맞추고 폭만 묶는다. */
.a2w-inq-body .a2w-inq,
.a2w-inq-body .a2w-inq__tolist { max-width: 720px; }

/* 폼은 화면 정중앙에 놓는다. 배너 제목은 왼쪽에 있어도 된다.
   .a2w-wrap 이 이미 화면 가운데이므로 그 안에서 auto 로 가운데를 잡으면
   화면 정중앙이 된다. 좌우만 auto 로 덮는다 —
   .a2w-inq{margin:0} 과 .a2w-inq__tolist{margin:18px 0 0} 의
   세로 여백은 그대로 두어야 한다. 2026-09-02 */
.a2w-inq-body .a2w-inq,
.a2w-inq-body .a2w-inq__tolist,
.a2w-inq-body .a2w-inq-done,
.a2w-inq-body .a2w-list,
.a2w-inq-body .a2w-detail,
.a2w-inq-body .a2w-faq {
  margin-left: auto;
  margin-right: auto;
}

/* ==========================================================================
   A2W 자주 묻는 질문 · 2026-09-02
   <details>/<summary> 기본 동작을 쓴다. JS 없음.
   ========================================================================== */
.a2w-faq {
  max-width: 720px;
  margin-top: 56px;
}

.a2w-faq__h {
  margin: 0 0 18px;
  font-size: 22px;
  font-weight: 800;
  color: var(--global-palette3);
}

.a2w-faq__empty {
  margin: 0;
  padding: 26px 20px;
  text-align: center;
  font-size: 16px;
  color: var(--global-palette6);
  background: #F7FAFC;
  border: 1px dashed var(--a2w-line-blue);
  border-radius: 8px;
}

.a2w-faq__item {
  border-bottom: 1px solid var(--a2w-line);
}

/* 손가락 표적을 크게. 40~50대 기준으로 글자도 줄이지 않는다. */
.a2w-faq__q {
  list-style: none;            /* 기본 삼각형 대신 우리 표시를 쓴다 */
  cursor: pointer;
  padding: 18px 34px 18px 2px;
  position: relative;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.6;
  color: var(--global-palette3);
}
.a2w-faq__q::-webkit-details-marker { display: none; }

.a2w-faq__q::after {
  content: "";
  position: absolute;
  right: 8px;
  top: 50%;
  width: 9px;
  height: 9px;
  margin-top: -6px;
  border-right: 2px solid var(--global-palette6);
  border-bottom: 2px solid var(--global-palette6);
  transform: rotate(45deg);
  transition: transform .15s ease;
}
.a2w-faq__item[open] .a2w-faq__q::after {
  transform: rotate(225deg);
  margin-top: -2px;
}

.a2w-faq__q:hover { color: var(--global-palette1); }
.a2w-faq__q:focus-visible { outline: 3px solid var(--global-palette1); outline-offset: -3px; }

.a2w-faq__a {
  padding: 0 2px 20px;
  font-size: 16.5px;
  line-height: 1.85;
  color: var(--global-palette5);
}
.a2w-faq__a p { margin: 0 0 12px; }
.a2w-faq__a p:last-child { margin-bottom: 0; }

@media (max-width: 767px) {
  .a2w-faq { margin-top: 40px; }
  .a2w-faq__h { font-size: 20px; }
}

/* 이미지를 못 찾았을 때는 넓은 화면에서도 2단으로 쪼개지 않는다.
   빈 칸이 생기면 제목이 왼쪽으로 몰려 보인다. */
@media (min-width: 900px) {
  .a2w-cathero--noimg .a2w-cathero__in { grid-template-columns: 1fr; }
}

/* Kadence 가 본문 위에 따로 찍는 제목 띠를 없앤다.
   배너 안에 h1 이 있어 그대로 두면 같은 제목이 두 번 나온다.
   페이지 번호가 아니라 표시 클래스로 건다 — 배너를 쓰는 화면이 늘어나도 따라온다. */
.a2w-inq-page .entry-hero,
.a2w-inq-page .page-hero-section { display: none; }

/* 배너를 헤더 바로 아래에 붙인다.
   카테고리 화면은 본문 바깥이라 헤더와 간격이 0 이다(2026-09-02 실측).
   이 페이지는 본문 안이라 위쪽에 여백이 두 겹 있어 112px 이 떠 있었다.
     .content-area      margin-top 80px
     .entry-content-wrap padding-top 32px
   이 페이지 본문은 배너로 시작하므로 둘 다 0 으로 둔다.
   아래쪽 간격은 .a2w-cathero--page 의 margin-bottom 이 갖는다. */
.a2w-inq-page .content-area { margin-top: 0; }
.a2w-inq-page .entry-content-wrap { padding-top: 0; }

@media (max-width: 767px) {
  .a2w-cathero--page { margin-bottom: 28px; }
}
/* ==========================================================================
   A2W 푸터 아래쪽 행 · 2026-09-02
   footer_items 의 bottom_1 에 footer-navigation 을 넣어 메뉴가 생겼다.
   Kadence 는 이 행을 가로(flex row)로 놓는데, 390px 에서는 메뉴가 폭을
   거의 다 먹고 저작권이 57px 로 눌려 두 줄로 깨졌다(2026-09-02 실측).
   좁은 화면에서만 세로로 쌓고 가운데로 맞춘다.
   ========================================================================== */
@media (max-width: 767px) {
  #colophon .site-footer-bottom-section-1 {
    flex-direction: column;
    align-items: center;
    row-gap: 10px;
  }
  #colophon .footer-navigation .footer-menu-container > ul {
    justify-content: center;
    flex-wrap: wrap;
  }
}
/* ==========================================================================
   A2W 조회수 · 2026-09-02
   기준(50회) 미만이면 서버가 아예 출력하지 않는다. 여기 규칙은 그때는 쓰이지 않는다.
   ========================================================================== */
.a2w-views {
  font-size: 14.5px;
  color: var(--global-palette6);
  white-space: nowrap;
}
/* 카드 안에서는 날짜 옆에 살짝 띄운다 */
.a2w-card__meta .a2w-views,
.a2w-feat__meta .a2w-views { margin-left: 8px; }
/* 글 상세의 .entry-meta 는 항목 사이 구분점을 스스로 넣는다. 겹치지 않게 여백만. */
.entry-meta .a2w-views { margin-left: 6px; }

/* ==========================================================================
   HOME-LATEST-UX-POLISH-01 · 홈 하단 두 섹션 (2026-09-21)
   마크업은 functions.php 의 [a2w_home_latest] · [a2w_home_news] 가 그린다.

   기존 디자인 값을 그대로 쓴다 — 흰 카드 · 1px var(--a2w-line) · radius 12px ·
   이미지 16:9 · 공통 폭은 .a2w-wrap(1120px) 이 소유한다.
   여백은 이 두 섹션에만 건다. 공통 .a2w-sec 의 padding 은 건드리지 않는다.

   ★ h3 · p · ul · h2 에는 섹션 클래스를 앞에 붙여 (0,2,0) 으로 쓴다.
     Kadence 의 .single-content h3 / p / ul (0,1,1) 이 클래스 하나(0,1,0)를 이긴다.
     처음엔 제목 위 36px · 요약 아래 32px · 목록 왼쪽 34px 가 그대로 들어갔다(2026-09-21 실측).

   아래 D · E 절(.a2w-guide / .a2w-news)은 옛 쿼리 블록용이다.
   홈 본문을 새 단축코드로 바꾼 뒤에는 쓰이지 않는다. 운영 반영을 확인한 다음 지운다.
   ========================================================================== */

/* --- 최신 가이드 : 왼쪽 대표 1 + 오른쪽 목록 3 ----------------------------- */
.a2w-latest { padding-top: 64px; padding-bottom: 64px; }
.a2w-latest .a2w-head { margin-bottom: 26px; }

.a2w-latest__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }

.a2w-latest__lead,
.a2w-latest__item {
  background: #FFFFFF;
  border: 1px solid var(--a2w-line);
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.a2w-latest__lead:hover,
.a2w-latest__item:hover { border-color: var(--a2w-line-blue); box-shadow: 0 10px 26px rgba(16, 40, 74, .09); }
.a2w-latest__lead:focus-visible,
.a2w-latest__item:focus-visible { outline: 3px solid var(--global-palette1); outline-offset: 2px; }

.a2w-latest__lead { display: flex; flex-direction: column; }

/* 이미지 칸은 비율을 스스로 갖는다. 그림이 늦게 떠도 화면이 밀리지 않는다. */
.a2w-latest__leadimg,
.a2w-latest__thumb {
  display: block;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #EDF2F9;
  line-height: 0;
}
.a2w-latest__leadimg img,
.a2w-latest__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

.a2w-latest__leadbody { display: flex; flex-direction: column; flex: 1 1 auto; padding: 20px 22px 22px; }

.a2w-latest__cat {
  display: block;
  font-size: 12.5px; font-weight: 700; letter-spacing: .02em;
  color: var(--global-palette1);
}
.a2w-latest .a2w-latest__leadtitle {
  margin: 8px 0 10px;
  font-size: 22px; line-height: 1.45; font-weight: 800; letter-spacing: -.01em;
  color: var(--global-palette3);
  word-break: keep-all; overflow-wrap: break-word;
}
.a2w-latest .a2w-latest__ex {
  margin: 0 0 14px;
  font-size: 15.5px; line-height: 1.7;
  color: var(--global-palette5);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}
.a2w-latest__date {
  display: block;
  font-family: var(--a2w-mono); font-size: 12px; letter-spacing: .04em;
  color: var(--global-palette6);
}
.a2w-latest__leadbody .a2w-latest__date { margin-top: auto; }
.a2w-latest__lead:hover .a2w-latest__leadtitle,
.a2w-latest__item:hover .a2w-latest__title { color: var(--global-palette1); }

.a2w-latest .a2w-latest__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.a2w-latest__row { margin: 0; min-width: 0; }

.a2w-latest__item { display: flex; align-items: center; gap: 14px; height: 100%; padding: 12px; box-sizing: border-box; }
.a2w-latest__thumb { flex: none; width: 112px; border-radius: 8px; }
.a2w-latest__itembody { min-width: 0; flex: 1 1 auto; }
.a2w-latest .a2w-latest__title {
  margin: 5px 0 7px;
  font-size: 16.5px; line-height: 1.5; font-weight: 700;
  color: var(--global-palette3);
  word-break: keep-all; overflow-wrap: break-word;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
}

/* 자리표시(.a2w-fallback)는 칸을 가득 채운다 */
.a2w-latest__thumb .a2w-fallback b { font-size: 13px; }

/* 600~899px(태블릿) — 대표 카드를 가로로 눕힌다.
   세로형 그대로 두면 이미지가 폭 732px · 높이 412px 가 되어 섹션이 1,200px 를 넘는다(실측). */
@media (min-width: 600px) and (max-width: 899px) {
  .a2w-latest__lead { flex-direction: row; align-items: stretch; }
  .a2w-latest__leadimg { flex: 0 0 44%; aspect-ratio: auto; min-height: 100%; }
  .a2w-latest__leadbody { min-width: 0; }
}

@media (min-width: 900px) {
  .a2w-latest__grid { grid-template-columns: minmax(0, 1.16fr) minmax(0, 1fr); gap: 26px; align-items: stretch; }
  /* 글이 1편뿐이면 대표 카드가 폭을 다 먹지 않게 한다 */
  .a2w-latest__grid--solo { grid-template-columns: minmax(0, 620px); }
  /* 목록 3줄이 대표 카드 높이를 똑같이 나눠 갖는다. 아래쪽이 들쭉날쭉하지 않다. */
  .a2w-latest__list { grid-auto-rows: 1fr; }
  .a2w-latest__thumb { width: 136px; }
  .a2w-latest .a2w-latest__title { -webkit-line-clamp: 2; }
}

/* --- AI 최신 소식 : 큰 카드가 아니라 한 줄씩 -------------------------------
   글이 1편이어도 빈 공간이 남지 않는다. 늘어나면 아래로 줄만 추가된다. */
.a2w-newsline { padding-top: 40px; padding-bottom: 44px; }

.a2w-newsline__in { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.a2w-newsline__head .a2w-eyebrow { margin-bottom: 8px; }
.a2w-newsline .a2w-newsline__h { margin: 0; font-size: 22px; }
.a2w-newsline__head .a2w-more { display: inline-block; margin-top: 10px; padding: 4px 0; }

.a2w-newsline .a2w-newsline__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--a2w-line); }
.a2w-newsline__list > li { margin: 0; border-bottom: 1px solid var(--a2w-line); }

.a2w-newsline__item {
  display: flex; align-items: baseline; gap: 16px;
  padding: 15px 4px;                       /* 손가락 표적 */
  text-decoration: none; color: inherit;
}
.a2w-newsline__title {
  flex: 1 1 auto; min-width: 0;
  font-size: 16.5px; line-height: 1.55; font-weight: 700;
  color: var(--global-palette3);
  word-break: keep-all; overflow-wrap: break-word;
}
.a2w-newsline__date {
  flex: none;
  font-family: var(--a2w-mono); font-size: 12px; letter-spacing: .04em;
  color: var(--global-palette6); white-space: nowrap;
}
.a2w-newsline__go { flex: none; color: var(--global-palette1); font-weight: 700; }
.a2w-newsline__item:hover .a2w-newsline__title { color: var(--global-palette1); }
.a2w-newsline__item:focus-visible { outline: 3px solid var(--global-palette1); outline-offset: -3px; }

@media (min-width: 900px) {
  .a2w-newsline__in { grid-template-columns: 220px minmax(0, 1fr); gap: 44px; align-items: start; }
}

@media (max-width: 767px) {
  .a2w-latest { padding-top: 48px; padding-bottom: 48px; }
  .a2w-latest__leadbody { padding: 18px 18px 20px; }
  .a2w-latest .a2w-latest__leadtitle { font-size: 20px; }
  .a2w-newsline { padding-top: 34px; padding-bottom: 36px; }
  /* 좁은 폭에서는 제목이 한 줄을 다 쓰고 날짜가 아래로 내려간다 */
  .a2w-newsline__item { flex-wrap: wrap; gap: 4px 12px; }
  .a2w-newsline__title { flex: 1 1 100%; }
  .a2w-newsline__go { display: none; }
}