.page .entry-title {
  display: none;
}
/* Vitamin Soda Global Layout */
.vs-wrap {
  max-width: 980px;
  margin: 0 auto;
  padding: 30px;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height: 1.7;
  color: #222;
  background: #f8fafc;
}

/* Section Blocks */
.vs-box {
  background: #fff;
  border-radius: 10px;
  padding: 22px;
  margin-bottom: 24px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
}

.vs-box.blue { border-left: 6px solid #0ea5e9; }
.vs-box.green { border-left: 6px solid #14b8a6; }

.vs-hero {
  background: linear-gradient(135deg, #dff6ff, #fefefe);
  border-radius: 14px;
  padding: 32px 24px;
  margin-bottom: 24px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.vs-hero h1 {
  margin: 8px 0 10px 0;
  font-size: 30px;
  line-height: 1.25;
  color: #0c4a6e;
}

.vs-kicker {
  font-size: 13px;
  letter-spacing: .08em;
  color: #0284c7;
  text-transform: uppercase;
}

/* Badges */
.vs-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.vs-badge {
  font-size: 12px;
  padding: 6px 12px;
  background: #0ea5e9;
  color: #fff;
  border-radius: 999px;
}

/* Titles */
.vs-box h2 { margin: 0 0 10px 0; font-size: 22px; color: #0f172a; }
.vs-box h3 { margin: 12px 0 6px 0; font-size: 16px; color: #0ea5e9; }

/* Lists and FAQ */
.vs-list { margin: 8px 0 0 20px; color: #334155; }
.vs-faq dt { font-weight: 700; margin-top: 8px; color: #0284c7; }
.vs-faq dd { margin: 4px 0 10px 0; color: #334155; }

/* CTA */
.vs-cta {
  background: linear-gradient(135deg, #0ea5e9, #14b8a6);
  border-radius: 14px;
  padding: 28px;
  text-align: center;
  color: #fff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
.vs-cta a {
  display: inline-block;
  margin-top: 4px;
  padding: 10px 18px;
  background: #fff;
  color: #0ea5e9;
  border-radius: 10px;
  text-decoration: none;
  font-weight: 600;
}
.vs-cta a:hover { background: #e0f2fe; }

.vs-footer {
  margin-top: 22px;
  text-align: center;
  color: #64748b;
  font-size: 13px;
}
body{outline:2px solid red !important;}
.vs-wrap *{box-sizing:border-box}
.vs-box h2{color:#0f172a !important;font-size:22px !important;margin:0 0 10px 0 !important}
.vs-box h3{color:#0ea5e9 !important;font-size:16px !important;margin:12px 0 6px 0 !important}
.vs-cta a{background:#fff !important;color:#0ea5e9 !important}

/* 블로그 글 목록 카드 */
.ast-article-post {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
  padding: 20px;
  margin-bottom: 24px;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.ast-article-post:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.15);
}

/* 카드 제목 */
.ast-article-post .entry-title a {
  color: #0096C7;
  text-decoration: none;
}
.ast-article-post .entry-title a:hover {
  color: #0077B6;
}

/* 카드 내부 이미지 둥근 모서리 */
.ast-article-post .post-thumb img {
  border-radius: 10px;
}
body {
  background-color: #E3F2FD;
  color: #334155;
  font-family: 'Noto Sans KR', sans-serif;
}

/* 헤더 */
.site-header {
  background-color: #0096C7;
}
.site-header a {
  color: #FFFFFF;
}
.site-header a:hover {
  color: #F6E6CB;
}

/* 버튼 */
button, .ast-button {
  background-color: #FF7E67;
  color: #fff;
  border-radius: 8px;
  padding: 10px 18px;
  font-weight: 500;
}
button:hover, .ast-button:hover {
  background-color: #E76F51;
}

/* 카드형 포스트 */
.ast-article-post {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  padding: 20px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ast-article-post:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

/* 링크 색상 */
a {
  color: #0096C7;
}
a:hover {
  color: #0077B6;
}
/* ===== 블로그 요약 카드형 디자인 ===== */
.blog .ast-article-post, 
.archive .ast-article-post {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.08);
  padding: 20px;
  margin-bottom: 30px;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* 마우스오버 효과 */
.blog .ast-article-post:hover, 
.archive .ast-article-post:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 15px rgba(0,0,0,0.12);
}

/* 썸네일 이미지 둥글게 */
.blog .post-thumb img, 
.archive .post-thumb img {
  border-radius: 10px;
  margin-bottom: 15px;
}

/* 제목 스타일 */
.blog .entry-title a, 
.archive .entry-title a {
  color: #0096C7;
  text-decoration: none;
}
.blog .entry-title a:hover, 
.archive .entry-title a:hover {
  color: #0077B6;
}

/* 발췌문 (요약 텍스트) */
.blog .entry-content p, 
.archive .entry-content p {
  color: #334155;
  font-size: 15px;
  line-height: 1.6;
}

/* 날짜, 작성자 등 메타영역 */
.blog .entry-meta, 
.archive .entry-meta {
  font-size: 13px;
  color: #64748b;
  margin-bottom: 10px;
}

/* 글 목록 전체 배경 */
body.blog, body.archive {
  background-color: #E3F2FD;
  padding-top: 20px;
}
/* ===== Right Sidebar widgets (Astra) ===== */
.ast-right-sidebar .widget {
  background:#fff;
  border-radius:8px;
  padding:14px 16px;
  margin-bottom:20px;
  box-shadow:0 2px 8px rgba(0,0,0,.06);
  border-left:5px solid #0096C7;
}

/* 위젯 제목 */
.ast-right-sidebar .widget .widget-title {
  margin:0 0 10px 0;
  font-size:17px;
  line-height:1.2;
  color:#0f172a;
  position:relative;
  padding-left:26px;
}
.ast-right-sidebar .widget .widget-title:before{
  content:"";
  position:absolute; left:0; top:50%;
  width:14px; height:14px; transform:translateY(-50%);
  border-radius:3px; background:#0096C7;
}

/* 공통 링크/리스트 */
.ast-right-sidebar .widget ul{list-style:none;margin:0;padding:0}
.ast-right-sidebar .widget ul li{margin:6px 0}
.ast-right-sidebar .widget a{
  color:#0096C7;
  text-decoration:none;
  font-size:14px;
  line-height:1.5;
  word-break:keep-all;
}
.ast-right-sidebar .widget a:hover{color:#0077B6;text-decoration:underline}
.ast-right-sidebar .widget .recentcomments,
.ast-right-sidebar .widget .rssSummary{color:#64748b;font-size:13px}

/* 검색 위젯 */
.widget_search form{display:grid;grid-template-columns:1fr auto;gap:8px}
.widget_search input[type="search"]{
  height:36px;
  border:1px solid #cfe0f2;
  border-radius:6px;
  padding:0 10px;
  font-size:14px;
  background:#fff;
  color:#334155;
}
.widget_search input[type="submit"],
.widget_search button[type="submit"]{
  height:36px;
  padding:0 14px;
  border:0;
  border-radius:8px;
  background:#0096C7;
  color:#fff;
  font-size:14px;
  font-weight:500;
  cursor:pointer;
}
.widget_search input[type="submit"]:hover,
.widget_search button[type="submit"]:hover{background:#0077B6}

/* 드롭다운 위젯 */
.widget_archive select,
.widget_categories select{
  width:100%;
  height:36px;
  border:1px solid #cfe0f2;
  border-radius:6px;
  padding:0 8px;
  font-size:14px;
  background:#fff;
}

/* 카드 간격 */
.ast-right-sidebar .widget + .widget{margin-top:20px}

/* 모바일 */
@media (max-width:768px){
  .ast-right-sidebar .widget{border-radius:6px;padding:12px}
  .ast-right-sidebar .widget .widget-title{font-size:16px}
}

/* ===== 모바일에서 폭 넓게 보이도록 조정 ===== */
@media (max-width: 768px) {
  /* 비타민 소다 레이아웃 */
  .vs-wrap {
    max-width: 100% !important;   /* 부모 폭 꽉 채우기 */
    padding: 16px 14px !important;/* 좌우 여백 줄이기 (기존 30px -> 12px) */
  }

  /* 블로그 카드 */
  .blog .ast-article-post,
  .archive .ast-article-post {
    padding: 16px !important;
    margin: 0 10px 20px !important; /* 좌우 여백 축소 */
  }

  /* 우측 사이드바 위젯 */
  .ast-right-sidebar .widget {
    padding: 12px !important;
    margin: 0 10px 18px !important;
  }

  /* 전체 배경 여백 약간 줄이기 */
  body.blog,
  body.archive {
    padding-top: 10px !important;
  }
}
/* ===== 모바일 좌우 여백 비대칭 해결 ===== */
@media (max-width: 768px) {

  /* Astra 기본 콘텐츠 영역 패딩 강제 균등화 */
  .site-content,
  .ast-container,
  .site-main {
    padding-left: 2px !important;
    padding-right: 2px !important;
  }

  /* 비타민 소다 래퍼 */
  .vs-wrap {
    padding-left: 2px !important;
    padding-right: 2px !important;
  }

  /* 블로그 카드 박스 */
  .blog .ast-article-post,
  .archive .ast-article-post {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* 우측 사이드바 (모바일에서는 아래로 내려가므로 좌우 균등) */
  .ast-right-sidebar .widget {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

.site-header .ast-container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:14px 0}
.site-branding{display:flex;align-items:center;gap:10px}
.site-logo{width:48px;height:48px;border-radius:8px}
.site-title a{text-decoration:none;color:#ff6600;font-weight:700;font-size:1.25rem}
.site-description{margin:0;font-size:.9rem;color:#666}
.main-navigation a{margin-right:14px;color:#222;text-decoration:none;font-size:.95rem}
.main-navigation a:hover{color:#ff6600}
.blog-card{margin-bottom:18px}
.blog-card .entry-title{font-size:1.35rem;margin:0 0 8px}
.blog-card .read-more{font-weight:600}
.entry-content img{max-width:100%;height:auto}