/* 마케팅 예산 짜기 — 소개 탭과 같은 라이트/ILION 그린 테마 (가독성 우선: 15px 기본, 진한 회색).
   클래스명은 계산기 스크립트(budget.js)가 참조하는 것을 그대로 유지: .page .card .muted .btn .form-input .keyword-table 등 */
.il-budget{
  --il:#01A081; --il-dark:#018a6f; --il-tint:#E6F5F0; --il-tint-2:#cdeee3;
  --ink:#111; --body:#3a3a3a; --mute:#5f6670; --line:#e5e7eb; --line-soft:#eef0f3;
  --radius:16px;
  color:var(--ink); background:#fff;
  font-family:'Pretendard', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size:15px; line-height:1.7; letter-spacing:-.01em; -webkit-font-smoothing:antialiased;
  word-break:keep-all;
}
.il-budget a{color:var(--il);text-decoration:none;}
.il-budget a:hover{color:var(--il-dark);}
.il-budget strong{color:var(--ink);font-weight:700;}
.il-budget .muted{color:var(--mute);}
.il-budget .muted strong{color:#222;}

/* ── 페이지 헤더 (소개 탭 섹션 헤더와 동일한 문법: 라벨 → 검정 구분선 → 그린 제목) ── */
.il-budget .page{max-width:1100px;margin:0 auto;}
.il-budget .page-header{margin-bottom:28px;}
.il-budget .page-label{font-size:12px;font-weight:800;color:var(--il);letter-spacing:.08em;}
.il-budget .page-rule{height:2px;background:var(--ink);margin:8px 0 22px;}
.il-budget .page-header h1{font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--il);
  display:flex;align-items:center;gap:10px;line-height:1.3;}
.il-budget .page-h1-icon{width:26px;height:26px;stroke:var(--il);stroke-width:2;fill:none;flex-shrink:0;}
.il-budget .page-sub{color:var(--body);margin-top:10px;font-size:16px;line-height:1.8;max-width:800px;}
@media (min-width:768px){
  .il-budget .page-label{font-size:13px;}
  .il-budget .page-header h1{font-size:28px;}
  .il-budget .page-sub{font-size:17px;}
}

/* ── 카드 ── */
.il-budget .card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 20px;margin-bottom:16px;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06);}
@media (min-width:768px){ .il-budget .card{padding:28px 30px;} }
.il-budget .card h3{font-size:19px;font-weight:800;color:var(--ink);letter-spacing:-.01em;
  margin:0 0 14px;line-height:1.4;}
@media (min-width:768px){ .il-budget .card h3{font-size:21px;} }
.il-budget .card--accent{border-color:var(--il-tint-2);box-shadow:0 0 0 3px var(--il-tint),0 1px 3px rgba(16,24,40,.06);}

/* ── 폼 컨트롤 ── */
.il-budget input, .il-budget select, .il-budget textarea{
  font-family:inherit;font-size:15px;color:var(--ink);background:#fff;
  border:1px solid #cfd4db;border-radius:10px;padding:8px 12px;
  transition:border-color .12s,box-shadow .12s;}
.il-budget input::placeholder{color:#9aa0a8;}
.il-budget input:focus, .il-budget select:focus{outline:none;border-color:var(--il);box-shadow:0 0 0 3px rgba(1,160,129,.14);}
.il-budget .form-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px;}
.il-budget .form-row > label{font-size:15px;font-weight:700;color:var(--ink);}
@media (max-width:640px){ .il-budget .form-row label{flex:1 1 100%;} }

/* ── 버튼 ── */
.il-budget .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:42px;padding:0 20px;border:none;border-radius:9999px;font-family:inherit;
  font-size:15px;font-weight:700;letter-spacing:-.01em;white-space:nowrap;cursor:pointer;
  transition:background .12s,color .12s,border-color .12s,transform .12s,box-shadow .12s;}
.il-budget .btn:active{transform:scale(.98);}
.il-budget .btn:disabled{opacity:.4;cursor:not-allowed;pointer-events:none;}
.il-budget .btn--primary{background:var(--il);color:#fff;box-shadow:0 8px 20px -8px rgba(1,160,129,.55);}
.il-budget .btn--primary:hover{background:var(--il-dark);color:#fff;}
.il-budget .btn-outline{background:#fff;color:var(--ink);border:1px solid #cfd4db;}
.il-budget .btn-outline:hover{border-color:var(--il);color:var(--il);}
.il-budget .btn-sm{height:32px;padding:0 12px;font-size:15px;border-radius:8px;}

/* ── 항목 표 ── */
.il-budget .keyword-table{width:100%;border-collapse:collapse;font-size:15px;}
.il-budget .keyword-table th, .il-budget .keyword-table td{padding:14px 12px;border-bottom:1px solid var(--line-soft);text-align:left;vertical-align:middle;line-height:1.6;}
.il-budget .keyword-table tr:last-child td{border-bottom:none;}
.il-budget .keyword-table th{font-size:13px;color:var(--mute);font-weight:700;letter-spacing:.04em;
  position:sticky;top:0;background:#fff;z-index:1;white-space:nowrap;border-bottom:2px solid var(--line);}
.il-budget .keyword-table tbody tr:hover{background:#fafbfc;}
.il-budget .keyword-table td.qt-group{color:var(--il) !important;font-weight:800 !important;font-size:15px !important;padding-top:26px !important;}
.il-budget .keyword-table td.qt-name{font-weight:700;color:var(--ink);font-size:16px;}
.il-budget .keyword-table td.qt-name .muted{font-weight:400;}
.il-budget .keyword-table td.qt-sub{font-weight:700;color:var(--ink);font-size:16px;}
.il-budget .keyword-table td.qt-sub.muted{color:var(--mute);font-weight:400;}
.il-budget .keyword-table td.qt-grade > span{font-weight:600;}
.il-budget .keyword-table .muted{color:var(--mute);}
/* 데스크톱 열 너비 고정 — 단가 설명(구간가)이 nowrap 으로 폭을 독점해 항목명이 세로로 쪼개지는 것 방지 */
@media (min-width:701px){
  .il-budget .keyword-table th:first-child, .il-budget .keyword-table td.qt-name{width:36%;}
  .il-budget .keyword-table td.qt-grade{width:11%;}
  .il-budget .keyword-table td.qt-price{white-space:normal !important;width:30%;}
  .il-budget .keyword-table td.qt-price > .muted{display:block;line-height:1.5;margin-top:4px;font-size:13px !important;}
  .il-budget .keyword-table td.qt-qty{white-space:nowrap;width:1%;}
  .il-budget .keyword-table td.qt-name > .muted{font-size:13.5px !important;}
}

/* ── 접이식 설명 ── */
.il-budget details{border-top:1px solid var(--line-soft);padding-top:12px;}
.il-budget summary{color:var(--ink);}
.il-budget summary:hover{color:var(--il);}
.il-budget details[open] summary{color:var(--il);}
.il-budget details .muted{color:var(--body);}
.il-budget .qm-tier-table th{color:var(--mute);}
.il-budget .qm-tier-table th:last-child{color:var(--il) !important;}
.il-budget .qm-tier-table tr{border-top:1px solid var(--line-soft) !important;}
.il-budget .qm-tier-table tr:last-child{color:var(--il) !important;}