/* Read-only preview: accurate availability and a consistent ochre contact panel. */
.preview-status{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 20px;padding:10px 0;border-bottom:1px solid var(--warm-line);font-size:13px;color:var(--warm-sub);line-height:1.6}
.preview-status b{color:var(--warm-deep);margin-right:8px}.preview-status a{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;min-height:32px;color:var(--warm-deep)}
html[data-palette] .support-launcher,html[data-palette] .support-send{background:var(--warm-deep);color:#fff}html[data-palette] .support-panel>header{background:var(--warm-soft);color:var(--warm-ink)}
#support-body>label{display:block;font-size:14px;font-weight:650;margin:16px 0 6px}#support-body>input,#support-body>textarea{display:block;width:100%;box-sizing:border-box;padding:12px;border:1px solid var(--warm-line);border-radius:8px;color:var(--warm-ink);background:#fff;font:inherit}
#support-body>.support-send{margin-top:12px}#support-body>.subtle-link{display:inline-flex;align-items:center;gap:6px;min-height:44px}.support-close{min-width:44px;min-height:44px}
@media(max-width:540px){.preview-status{align-items:flex-start;flex-direction:column;gap:0;margin-bottom:16px}.preview-status a{min-height:36px}.support-panel{max-width:calc(100vw - 24px)}}
/* Keep the mobile opening focused on search and the first results. */
@media(max-width:540px){
 .preview-status{flex-direction:row;align-items:center;gap:8px;margin-bottom:12px;padding:6px 0}.preview-status a{min-height:36px}.preview-status a svg{display:none}
 html[data-palette] .brand-discovery{min-height:168px;padding:18px!important}
 html[data-palette] .brand-discovery h1{font-size:22px;line-height:1.45;letter-spacing:-.7px;margin-bottom:10px}
 html[data-palette] .brand-discovery p{max-width:calc(100% - 90px);font-size:13px;line-height:1.65}
 html[data-palette] .brand-discovery .discovery-art{width:88px;height:88px;right:10px;bottom:5px}
 .brand-page-hero{flex-wrap:nowrap;gap:8px}.brand-page-copy{flex-basis:auto}.brand-page-hero>.brand-owl{width:88px;height:88px;margin:0}
}
#support-body:has(#preview-topic){padding:0 20px 18px}#support-body:has(#preview-topic) .support-intro{padding:18px 0 4px}
html[data-palette] .support-panel{color:var(--warm-ink);border-color:var(--warm-line)}html[data-palette] .support-mark{background:var(--warm-line);color:var(--warm-deep)}html[data-palette] .support-panel header p,html[data-palette] .support-intro p,html[data-palette] .support-note,html[data-palette] .support-close{color:var(--warm-sub)}
html[data-palette] .support-send{font-size:14px;min-height:44px;width:100%}html[data-palette] .support-panel :focus-visible,html[data-palette] .support-launcher:focus-visible{outline-color:var(--warm-main)}
@media(max-width:899px){.filter-row .pill,.filter-row select,.audience-switch a{min-height:44px}#support-body>input,#support-body>textarea{font-size:16px}}
.top-actions .avatar{width:auto;min-width:44px;min-height:44px;padding:0 12px;border-radius:10px;gap:6px;display:flex;font-size:13px}.top-actions .avatar-label{display:inline}.top-actions .avatar svg{width:18px;height:18px}
.dialog-close{min-width:44px;min-height:44px}.ad-top-inquiry,.ad-inquiry{min-height:44px}
/* Keep the contact launcher clear of the deadline calendar and notice actions. */
@media(min-width:1280px){.support-launcher,.support-panel{right:auto;left:max(36px,calc((100vw - 1440px)/2 + 36px))}}
@media(min-width:900px) and (max-width:1279px){.support-launcher,.support-panel{right:auto;left:max(28px,calc((100vw - 1100px)/2 + 28px))}}
/* Primary controls remain reachable without floating launchers. */
.support-launcher[hidden]{display:none!important}
.footer-contact{color:var(--warm-deep);text-decoration:underline;text-underline-offset:4px}
.footer a,.footer-contact,.subtle-link,.back-link,.trending button,.ad-persona button,.ad-persona-btn,.filter-row .pill,.filter-row select,.preview-status a,#empty-reset{min-height:44px;display:inline-flex;align-items:center}
.card-link{min-height:44px}
.profile-actions #next{scroll-margin-block:20px 100px}
.ad-persona,.own-services a,.own-services button{min-height:44px;font-size:14px}
.profile-page>p{font-size:16px;line-height:1.8}
.profile-page>h2{font-size:20px;margin-top:28px;margin-bottom:12px}
.ad-creative p{font-size:14px;line-height:1.75}
.filter-row .pill,.filter-row select,.trending,.trending button,.results-meta,.card-details,.card-footer,.footer,.footer small,.help-line,.calendar-note,.proposal-scope,.top-actions .avatar{font-size:14px;line-height:1.65}
html[data-design=b] .card-details,html[data-design=b] .card-footer{font-size:14px}
html[data-palette] .hero p,html[data-palette] .brand-discovery p,html[data-palette] .growth-detail .sv-detail-head>p{font-size:16px;line-height:1.75}
.hero p.proposal-scope{font-size:14px;color:var(--warm-sub)}
.footer a,.footer-contact{vertical-align:middle}
.service-line-art{display:grid;place-items:center;background:var(--warm-soft)!important;color:var(--warm-deep);mask-image:none!important}
.service-line-art:before,.service-line-art:after{display:none!important}
.service-line-art>svg{width:64px;height:64px;stroke-width:1.4}
.growth-detail .growth-head-art.service-line-art{border-radius:24px;width:112px;height:112px;right:24px;top:64px;opacity:1}
@media(max-width:540px){
 .filter-row .pill{padding:0 10px}.filter-row select{max-width:155px}
 .growth-detail .growth-head-art.service-line-art{position:static;width:64px;height:64px;margin:16px 0 0;border-radius:16px}
 .growth-detail .growth-head-art.service-line-art>svg{width:38px;height:38px}
 .growth-detail .sv-detail-head h1{padding-right:0}
 .brand-page-hero{align-items:flex-start}
}

/* ===== round-03 ===== */
/* R2-A 잔여: 1440x900 위저드 5단계 완료 버튼이 폴드 안에 완전히 들어오도록 아래 여백 확보 */
@media(min-width:900px){.profile-page .profile-actions{padding-bottom:0}.profile-page{padding-bottom:132px}}
/* R2 잔여: 데스크톱 우측 레일 조작부 최소 32x32 */
@media(min-width:900px){
 .deadline-calendar .rail-title button{min-height:32px;min-width:32px}
 .calendar-nav button,[data-calendar-action]{min-width:32px;min-height:32px}
 #calendar-date{min-height:32px}
 .calendar-more,#more{min-height:36px}
 .deadline-calendar .calendar-week{gap:1px}
 .deadline-calendar .calendar-day{min-width:32px}
}
/* R2 잔여: 인라인 화살표 링크 터치 높이 확보와 링크 어포던스 통일 */
.tiny-arrow{min-height:32px}
@media(max-width:540px){.preview-status a svg{display:inline-block;width:12px;height:12px}}
/* R2 잔여: 375/390 히어로를 데스크톱과 같은 좌-카피/우-마스코트 균형으로 재구성 */
@media(max-width:540px){
 html[data-palette] .brand-discovery{min-height:0;padding:18px 108px 18px 18px!important}
 html[data-palette] .brand-discovery h1{font-size:21px}
 html[data-palette] .brand-discovery p{max-width:none}
 html[data-palette] .brand-discovery .discovery-art{width:88px;height:88px;right:12px;bottom:auto;top:50%;transform:translateY(-50%)}
}

@media(max-width:899px){.brand-link,.top-bar a:first-child,a[aria-label^="기회담"]{min-height:44px;display:inline-flex;align-items:center}
 .breadcrumb a{min-height:24px;display:inline-flex;align-items:center}
 /* 하단 고정 메뉴가 마지막 조작부를 덮지 않도록 본문 아래 여백을 메뉴 높이만큼 확보 */
 #main{padding-bottom:92px}}


/* ===== round-04 ===== */
/* R3-A 카드 제목이 말줄임표 없이 잘리던 문제 */
.card-link{text-overflow:ellipsis}
/* R3-C 저장 버튼이 제목 링크 우상단을 침범하던 문제 — 제목 폭에서 저장 버튼 자리를 뺀다 */
html[data-design=b] .card-link{padding-right:46px}
/* R3-D 1440x900 위저드 5단계 완료 버튼이 폴드 아래에 남던 문제 — 데스크톱에서 조작 줄을 화면에 고정 */
@media(min-width:900px){
 .profile-page .profile-actions{position:sticky;bottom:16px;z-index:2;background:var(--warm-bg);
  padding:12px 0 4px;margin-top:8px;box-shadow:0 -10px 14px -12px #2C261933}
}


/* ===== 화면이 비어 보이던 원인 보완 =====
   측정 결과 본문 2137px 중 3000px² 이상 그림은 부엉이 1장(329x210)뿐이고,
   칠해진 면의 92%가 흰색이며 옅은 황토 면은 1.8%였다.
   색을 정했는데 색이 '면'이 아니라 '점'으로만 존재하는 상태였다. */
/* 1. 공고 구역에 옅은 황토 면을 깔고 카드를 흰색으로 띄운다 (그림 추가 없이 가장 큰 변화) */
html[data-design=b] .notice-grid{background:var(--warm-soft);border-radius:18px;padding:16px;gap:14px;border-top-color:transparent}
html[data-design=b] .notice-card{background:#fff}
@media(max-width:540px){html[data-design=b] .notice-grid{padding:12px;border-radius:14px}}
/* 2. 히어로를 시각적 중심으로 키운다 — 면에 색을 주고 마스코트를 크게 */
@media(min-width:900px){
 html[data-palette] .brand-discovery{min-height:318px;background:var(--warm-soft)}
 html[data-palette] .brand-discovery .discovery-art{height:268px}
 html[data-palette] .brand-discovery h1{font-size:33px;line-height:1.36}
}
@media(min-width:541px) and (max-width:899px){
 html[data-palette] .brand-discovery{background:var(--warm-soft)}
}
@media(max-width:540px){
 html[data-palette] .brand-discovery .discovery-art{width:104px;height:104px}
 html[data-palette] .brand-discovery{padding:18px 122px 18px 18px!important}
}
/* 3. 우측 레일의 안내 카드도 흰 면 일색에서 벗어나게 한다 */
@media(min-width:900px){.right-rail>.rail-card:first-child{background:var(--warm-soft)}}
/* 분야 칩을 사업/생활 두 그룹으로 나눌 때의 배치 (그리드 8칸 규칙이 그룹 2개를 2칸으로 밀어넣던 문제) */
.categories.has-groups{display:flex!important;gap:22px;align-items:flex-start;overflow:auto}
.categories.has-groups .category-group{display:grid;grid-template-columns:repeat(var(--count),76px);gap:8px;flex:0 0 auto}
.categories.has-groups .category-group-label{grid-column:1/-1;margin-bottom:4px}
@media(max-width:540px){
 .categories.has-groups{gap:14px}
 .categories.has-groups .category-group{grid-template-columns:repeat(var(--count),68px);gap:6px}
}

/* ═══════════════════════════════════════════════════════════════
   디자인 부장 · 고도화 Round 01 (2026-09-16)
   공통규격 v1(outputs/upgrade-20260916/공통규격.md) 준수 버전.
   §12 "새 CSS 파일을 만들지 말고 기존 파일에 추가" 에 따라 preapp.css 에 붙임.

   조사 근거 (실측·출처 상세는 outputs/upgrade-20260916/design-round01.md)
   - 잡코리아 검색 목록: 메타를 "아이콘+텍스트 나열"이 아니라 칩으로 묶어
     카드 중단에 덩어리를 만든다. 카드 그림자 rgba(0,0,0,.02) 0 4px 8px ×37.
   - 사람인 직업별 목록: 카드 하단을 옅게 칠한 띠로 나눠 본문/출처를 두 톤으로.
     radius 16px ×158.
   - 원티드 채용 목록: 필터·태그 radius 9999px ×48, 카드·패널 8~12px.
     알약과 각진 면을 역할로 구분.
   - 당근 중고거래: 칩은 아이콘 붙은 윤곽 알약.
   - NN/g Cards: 카드는 테두리·배경·그림자로 공통영역을 만든다.

   공통규격 대응: 간격 4의 배수 8단계 / 반경 8·12·20·9999·50% /
   그림자 --sh-1,--sh-2 2단계 / 글자 32·24·18·16·14·13 · 굵기 400·600·700(+캡션 500) /
   전환 var(--ease) / 포커스 2px --warm-main / hover 는 배경 대신 테두리+그림자.
   ═══════════════════════════════════════════════════════════════ */

/* 공통규격 v1 부록 A — 디렉터 배포 토큰. 값을 바꾸지 말 것 */
:root{
  --g-1:4px; --g-2:8px; --g-3:12px; --g-4:16px;
  --g-5:24px; --g-6:32px; --g-7:48px; --g-8:64px;
  --r-1:8px; --r-2:12px; --r-3:20px; --r-pill:9999px;
  --sh-1:0 1px 2px rgba(44,38,25,.06), 0 2px 8px rgba(44,38,25,.05);
  --sh-2:0 8px 24px rgba(44,38,25,.12);
  --t-display-size:32px; --t-display-lh:40px;
  --t-title-size:24px;   --t-title-lh:34px;
  --t-section-size:18px; --t-section-lh:27px;
  --t-body-size:16px;    --t-body-lh:26px;
  --t-sub-size:14px;     --t-sub-lh:21px;
  --t-caption-size:13px; --t-caption-lh:19px;
  --ease:200ms cubic-bezier(0.16,1,0.3,1);
  --touch:44px;
}
@media (prefers-reduced-motion: reduce){ :root{ --ease:0s } }

/* ── A. 반경 수렴 (공통규격 C-4) ────────────────────────────────
   실측 1440px /notice 에서 11종(4·5·7·9·10·12·13·15·16·18·20·50%)이 섞여 있었다.
   매핑: 3·4·5·7·9·10 → 8, 13·14·15·16·18·22·23 → 12(모달 20), 999 → 9999. */
html[data-palette] .notice-card,
html[data-palette] .rail-card,
html[data-palette] .rail-note,
html[data-palette] .ad-preview-slot,
html[data-palette] .side-foot,
html[data-palette] .match-banner,
html[data-palette] .categories,
html[data-palette] .visual-hero,
html[data-palette] .brand-discovery,
html[data-palette] .brand-page-hero,
html[data-palette] .growth-hero,
html[data-palette] .growth-closing,
html[data-palette] .growth-partner,
html[data-palette] .detail-card,
html[data-palette] .profile-page,
html[data-palette] .empty,
html[data-palette] .sv-card,
html[data-palette] .sv-art,
html[data-palette] .growth-work-card,
html[data-palette] .growth-work-image,
html[data-palette] .growth-video-image,
html[data-palette] .cat-icon,
html[data-palette] .match-symbol,
html[data-palette] .sv-promo-symbol,
html[data-palette] .sv-promo-slide,
html[data-palette] .profile-icon,
html[data-palette] .support-mark{border-radius:var(--r-2)}

html[data-palette] .search,
html[data-palette] .search input,
html[data-palette] .option,
html[data-palette] .trust-box,
html[data-palette] .soft-note,
html[data-palette] .ad-creative,
html[data-palette] .calendar-day,
html[data-palette] .category,
html[data-palette] .primary,
html[data-palette] .secondary,
html[data-palette] .side-nav a,
html[data-palette] .card-details span,
html[data-palette] .own-services a,
html[data-palette] .own-services button,
html[data-palette] .ad-persona,
html[data-palette] #support-body>input,
html[data-palette] #support-body>textarea,
html[data-palette] .progress-track i,
html[data-palette] .sv-promo-dots button i,
html[data-palette] .footer small,
html[data-palette] .growth-service-proof{border-radius:var(--r-1)}

html[data-palette] .notice-grid{border-radius:0}
html[data-palette] .notice-card .card-footer{border-radius:0}
html[data-palette] .support-panel{border-radius:var(--r-3)}
html[data-palette] .support-launcher,
html[data-palette] .option .option-check{border-radius:50%}

html[data-palette] .pill,
html[data-palette] .filter-row select,
html[data-palette] .more,
html[data-palette] .badge,
html[data-palette] .card-category,
html[data-palette] .audience-switch,
html[data-palette] .audience-switch a,
html[data-palette] .eyebrow,
html[data-palette] .nav-count,
html[data-palette] .avatar,
html[data-palette] .ad-label,
html[data-palette] .sv-paid,
html[data-palette] .trending button,
html[data-palette] .match-banner>a{border-radius:var(--r-pill)}

/* ── B. 타이포 (공통규격 §4 · C-5) ──────────────────────────────
   기존: 텍스트 요소의 76%가 13~14px, 20px 이상은 2개뿐이었다.
   6단계로 다시 배치하고 굵기는 400/600/700(+캡션 500)만 쓴다. */
html[data-palette] .visual-hero h1,
html[data-palette] .brand-page-hero h1,
html[data-palette] .growth-hero h1{
  font-size:var(--t-display-size);line-height:var(--t-display-lh);
  font-weight:700;letter-spacing:-.02em;color:var(--warm-ink);
}
html[data-palette] .visual-hero h1 em,
html[data-palette] .brand-page-hero h1 em,
html[data-palette] .growth-hero h1 em{color:var(--warm-deep);font-style:normal}

html[data-palette] .section-heading h2,
html[data-palette] .detail-head h1,
html[data-palette] .profile-page h1{
  font-size:var(--t-title-size);line-height:var(--t-title-lh);
  font-weight:700;letter-spacing:-.02em;color:var(--warm-ink);
}
html[data-palette] .support-close{font-size:var(--t-title-size)}

html[data-palette] .notice-card .card-link h3,
html[data-palette] .match-banner h2,
html[data-palette] .detail-section h2,
html[data-palette] .empty h2,
html[data-palette] .sv-card h2,
html[data-palette] .rail-note h3,
html[data-palette] .growth-section-head h2,
html[data-palette] .sv-scope-heading{
  font-size:var(--t-section-size);line-height:var(--t-section-lh);
  font-weight:600;letter-spacing:-.01em;
}
html[data-palette] .notice-card .card-link h3{color:var(--warm-ink);min-height:54px}
html[data-palette] .rail-card>h2,html[data-palette] .rail-card>h3{
  font-size:var(--t-section-size);line-height:var(--t-section-lh);font-weight:600;letter-spacing:-.01em;
}

html[data-palette] .visual-hero p,
html[data-palette] .brand-page-hero p,
html[data-palette] .growth-hero p,
html[data-palette] .detail-section p,
html[data-palette] .profile-description,
html[data-palette] .empty p,
html[data-palette] .option span,
html[data-palette] .side-nav a,
html[data-palette] .search input{
  font-size:var(--t-body-size);line-height:var(--t-body-lh);font-weight:400;letter-spacing:-.01em;
}
html[data-palette] .side-nav a{font-weight:600}
html[data-palette] .visual-hero p,html[data-palette] .brand-page-hero p,
html[data-palette] .growth-hero p,html[data-palette] .detail-section p{color:var(--warm-sub)}
html[data-palette] .option span{font-weight:600;color:var(--warm-ink)}

html[data-palette] .card-details span,
html[data-palette] .sv-card p,
html[data-palette] .rail-card p,
html[data-palette] .rail-note p,
html[data-palette] .side-foot,
html[data-palette] .option small,
html[data-palette] .section-heading p,
html[data-palette] .results-meta,
html[data-palette] .soft-note,
html[data-palette] .footer,
html[data-palette] .growth-closing p,
html[data-palette] .growth-partner p,
html[data-palette] .match-banner p{
  font-size:var(--t-sub-size);line-height:var(--t-sub-lh);font-weight:400;color:var(--warm-sub);
}
html[data-palette] .rail-card p,html[data-palette] .rail-note p,
html[data-palette] .side-foot,html[data-palette] .soft-note,
html[data-palette] .footer,html[data-palette] .growth-partner p{line-height:22px}

html[data-palette] .badge,
html[data-palette] .card-category,
html[data-palette] .source-name,
html[data-palette] .card-footer,
html[data-palette] .category-group-label,
html[data-palette] .breadcrumb,
html[data-palette] .subtle-link,
html[data-palette] .preview-status,
html[data-palette] .ad-label,
html[data-palette] .ad-persona-label,
html[data-palette] .sv-paid,
html[data-palette] .suggestion-number,
html[data-palette] .nav-count,
html[data-palette] .detail-facts dt,
html[data-palette] .calendar-note,
html[data-palette] .trending button,
html[data-palette] .pill,
html[data-palette] .filter-row select,
html[data-palette] .more,
html[data-palette] .sv-card-cta,
html[data-palette] .growth-service-proof,
html[data-palette] .eyebrow{
  font-size:var(--t-caption-size);line-height:var(--t-caption-lh);font-weight:500;
}
html[data-palette] .category span:last-child,
html[data-palette] .audience-switch a,
html[data-palette] .subtle-link,
html[data-palette] .tiny-arrow,
html[data-palette] .growth-text-link,
html[data-palette] .detail-source,
html[data-palette] .help-line,
html[data-palette] .suggestion-reason,
html[data-palette] .card-footer .proof,
html[data-palette] .primary,
html[data-palette] .secondary{font-size:var(--t-caption-size);line-height:var(--t-caption-lh)}
html[data-palette] .detail-facts dd{font-size:var(--t-sub-size);line-height:var(--t-sub-lh);font-weight:700;color:var(--warm-ink)}
html[data-palette] .primary,html[data-palette] .secondary{font-weight:700}
html[data-palette] .pill,html[data-palette] .more,html[data-palette] .sv-card-cta,
html[data-palette] .filter-row select,html[data-palette] .trending button,
html[data-palette] .category span:last-child,html[data-palette] .audience-switch a{font-weight:600}
html[data-palette] .side-foot b{font-size:var(--t-sub-size);line-height:var(--t-sub-lh);font-weight:700;color:var(--warm-ink);display:block;margin-bottom:var(--g-2)}
/* 숫자는 tabular-nums (공통규격 §4) */
html[data-palette] .badge,html[data-palette] .results-meta b,
html[data-palette] .calendar-day,html[data-palette] .detail-facts dd,
html[data-palette] .nav-count{font-variant-numeric:tabular-nums}
html[data-palette] .results-meta b{font-size:var(--t-section-size);font-weight:700;color:var(--warm-deep)}

/* ── C. 그림자·전환·포커스·호버 (공통규격 §3 · §11) ───────────── */
html[data-palette] .notice-card,
html[data-palette] .rail-card,
html[data-palette] .rail-note,
html[data-palette] .sv-card,
html[data-palette] .search,
html[data-palette] .audience-switch,
html[data-palette] .detail-card,
html[data-palette] .profile-page,
html[data-palette] .cat-icon,
html[data-palette] .more{box-shadow:var(--sh-1)}
html[data-palette] .notice-card,
html[data-palette] .sv-card,
html[data-palette] .cat-icon,
html[data-palette] .option,
html[data-palette] .pill,
html[data-palette] .more,
html[data-palette] .trending button,
html[data-palette] .search{transition:border-color var(--ease), box-shadow var(--ease), color var(--ease)}
/* §9-7: 클릭 영역을 연한 황색으로 칠하지 않는다. 배경 대신 테두리+그림자. */
html[data-palette] .notice-card:hover,
html[data-palette] .sv-card:hover,
html[data-palette] .category:hover .cat-icon,
html[data-palette] .option:hover,
html[data-palette] .more:hover,
html[data-palette] .pill:hover,
html[data-palette] .trending button:hover{background:#fff;border-color:var(--warm-main);box-shadow:var(--sh-2)}
html[data-palette] .notice-card:hover .card-link h3{color:var(--warm-deep)}
html[data-palette] :focus-visible{outline:2px solid var(--warm-main);outline-offset:2px}

/* ── D. 공고 카드 ───────────────────────────────────────────────
   기존 실측: 흰 면 한 톤 · box-shadow 없음 · 보조 텍스트 3덩어리가
   전부 같은 색(#6D6047)·같은 크기대 → 카드 안에 위계가 없었다.
   사람인의 "바닥 띠 두 톤", 잡코리아의 "메타 칩"을 가져온다. */
html[data-palette] .notice-grid{gap:var(--g-4)}
html[data-palette] .notice-card{
  background:#fff;border:1px solid var(--warm-line);
  padding:var(--g-5) var(--g-5) 0;overflow:hidden;
}
@media(max-width:899px){html[data-palette] .notice-card{padding:var(--g-4) var(--g-4) 0}}

/* D-1. 상태 배지 — 공통규격 §8 표 그대로. 미리보기는 중립 표시(빨강 쓰지 않음). */
html[data-palette] .notice-card .card-top{align-items:center;gap:var(--g-2);padding-right:var(--touch);min-height:24px}
html[data-palette] .badge{
  display:inline-flex;align-items:center;height:24px;padding:0 var(--g-2);
  background:#fff;color:var(--warm-sub);border:1px solid var(--warm-line);
}
html[data-palette] .badge .badge-kicker,html[data-palette] .badge .badge-num{
  font-size:var(--t-caption-size);line-height:var(--t-caption-lh);font-weight:500;letter-spacing:0;
}
html[data-palette] .badge .badge-num{font-weight:700;color:var(--warm-ink)}
html[data-palette] .badge.gray{background:var(--warm-line);color:var(--warm-sub);border-color:transparent}
html[data-palette] .badge.gray .badge-num{color:var(--warm-sub);font-weight:500}
html[data-palette] .badge.urgent{background:#FFF1F1;color:#8F2336;border:1px solid #B75E6E}
/* 분류 칩은 각진 8px로 배지와 구분 (공통규격 §8) */
html[data-palette] .notice-card .card-category{
  margin-left:auto;border:1px solid var(--warm-line);border-radius:var(--r-1);
  padding:0 var(--g-2);height:24px;display:inline-flex;align-items:center;
  background:#fff;color:var(--warm-sub);max-width:47%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* D-2. 제목 — C-5 판정에 따라 카드 제목 우선 (≥900 18px / ≤899 16px) */
html[data-palette] .notice-card .card-link{padding-top:var(--g-3)}
html[data-palette] .notice-card .card-link h3{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

/* D-3. 메타 — 나열이 아니라 칩 (잡코리아) */
html[data-palette] .notice-card .card-details{margin-top:var(--g-3);gap:var(--g-2);flex-wrap:wrap}
html[data-palette] .notice-card .card-details span{
  background:#fff;border:1px solid var(--warm-line);
  padding:var(--g-1) var(--g-2);color:var(--warm-sub);gap:var(--g-1);
}
html[data-palette] .notice-card .card-details svg{width:14px;height:14px;stroke-width:1.7}

/* D-4. 바닥 — 옅게 칠한 띠로 두 톤 (사람인). 클릭 대상이 아니라 --warm-soft 허용(§5) */
html[data-palette] .notice-card .card-footer{
  margin:var(--g-4) calc(-1 * var(--g-5)) 0;padding:var(--g-3) var(--g-5);
  background:var(--warm-soft);border-top:1px solid var(--warm-line);
  color:var(--warm-sub);min-height:var(--touch);align-items:center;
}
@media(max-width:899px){
  html[data-palette] .notice-card .card-footer{margin:var(--g-3) calc(-1 * var(--g-4)) 0;padding:var(--g-3) var(--g-4)}
}
html[data-palette] .notice-card .source-name{font-weight:600;color:var(--warm-ink)}
html[data-palette] .notice-card .card-footer .proof{color:var(--warm-deep);font-weight:600}
html[data-palette] .notice-card .card-footer .proof svg{color:var(--warm-deep)}
html[data-palette] .notice-card .save-button{top:var(--g-3);right:var(--g-2);color:var(--warm-sub)}
html[data-palette] .notice-card .save-button:hover{background:none;color:var(--warm-main)}
html[data-palette] .notice-card .save-button.saved{color:var(--warm-main)}
html[data-palette] .notice-card .save-button.saved svg{fill:var(--warm-soft)}
html[data-palette] .notice-card .save-button svg{width:20px;height:20px;stroke-width:1.7}
html[data-palette] .suggestion-grid .notice-card .card-link h3{min-height:0}

/* ── E. 첫 화면 ─────────────────────────────────────────────── */
html[data-palette] .visual-hero,
html[data-palette] .brand-discovery,
html[data-palette] .brand-page-hero,
html[data-palette] .growth-hero,
html[data-palette] .growth-closing{
  background:var(--warm-soft);border:1px solid var(--warm-line);padding:var(--g-5);
}
html[data-palette] .visual-hero .eyebrow,
html[data-palette] .brand-page-hero .eyebrow{
  display:inline-flex;align-items:center;gap:var(--g-2);background:#fff;
  border:1px solid var(--warm-line);padding:var(--g-1) var(--g-3);
  color:var(--warm-deep);margin-bottom:var(--g-4);font-weight:600;
}
html[data-palette] .visual-hero .eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--warm-main)}
html[data-palette] .visual-hero p{margin-top:var(--g-3);max-width:34em}
html[data-palette] .brand-discovery .discovery-art{height:240px;align-self:end}
html[data-palette] .brand-discovery .discovery-art img{object-position:bottom center}

html[data-palette] .search{
  background:#fff;border:1px solid var(--warm-line);padding:var(--g-2) var(--g-2) var(--g-2) var(--g-4);gap:var(--g-2);
}
html[data-palette][data-design=b] .search{border-color:var(--warm-line);box-shadow:var(--sh-1)}
html[data-palette] .search:focus-within{border-color:var(--warm-main)}
html[data-palette] .search>svg{color:var(--warm-sub)}
html[data-palette] .search input::placeholder{color:var(--warm-sub)}
html[data-palette] .search button{min-width:var(--touch);min-height:var(--touch);border-radius:var(--r-1)}

/* 분야 선택 — 바탕을 면으로 묶고 타일은 흰 면 (§5: 클릭 대상은 흰 면 + 선) */
html[data-palette] .categories{
  background:var(--warm-soft);border:1px solid var(--warm-line);
  padding:var(--g-4);margin:var(--g-5) 0 var(--g-6);
}
html[data-palette] .category-group-label{color:var(--warm-sub);font-weight:600}
html[data-palette] .category .cat-icon{
  width:48px;height:48px;background:#fff;border:1px solid var(--warm-line);color:var(--warm-deep);
}
html[data-palette] .category .cat-icon svg{width:24px;height:24px;stroke-width:1.75}
html[data-palette] .category span:last-child{color:var(--warm-ink)}
html[data-palette] .category.selected .cat-icon{background:var(--warm-main);border-color:var(--warm-main);color:#fff;box-shadow:var(--sh-1)}
html[data-palette] .category.selected span:last-child{color:var(--warm-deep);font-weight:700}

/* 내 조건 배너 — §5: --warm-deep 면 + 흰 글자 (흰 7.54:1) */
html[data-palette][data-design=b] .match-banner{
  background:var(--warm-deep);padding:var(--g-4);gap:var(--g-4);box-shadow:none;
}
html[data-palette] .match-banner h2{color:#fff}
html[data-palette][data-design=b] .match-banner p{color:#fff;opacity:.88;margin-top:var(--g-1)}
html[data-palette] .match-symbol{background:#fff;width:44px;height:44px;display:grid;place-items:center}
html[data-palette][data-design=b] .match-banner>a{
  background:#fff;color:var(--warm-deep);padding:0 var(--g-4);min-height:var(--touch);
  display:inline-flex;align-items:center;gap:var(--g-2);font-weight:700;white-space:nowrap;
}

/* ── F. 필터·버튼·폼 ───────────────────────────────────────── */
html[data-palette] .filter-row .pill{border-color:var(--warm-line);background:#fff;color:var(--warm-ink);min-height:var(--touch);padding:0 var(--g-4)}
html[data-palette] .filter-row .pill.selected{background:var(--warm-ink);border-color:var(--warm-ink);color:#fff}
html[data-palette] .filter-row .pill.selected:hover{background:var(--warm-ink);border-color:var(--warm-main)}
html[data-palette] .filter-row select{border-color:var(--warm-line);color:var(--warm-ink);min-height:var(--touch);padding-left:var(--g-3)}
html[data-palette] .more{border-color:var(--warm-line);color:var(--warm-ink);min-height:var(--touch);margin-top:var(--g-5)}
html[data-palette] .trending button{border:1px solid var(--warm-line);background:#fff;padding:0 var(--g-3);min-height:var(--touch);color:var(--warm-ink)}
html[data-palette] .primary{background:var(--warm-main);min-height:var(--touch);box-shadow:none}
html[data-palette] .primary:hover{background:var(--warm-deep)}
html[data-palette] .secondary{border-color:var(--warm-line);color:var(--warm-ink);min-height:var(--touch)}
html[data-palette] .secondary:hover{border-color:var(--warm-main);color:var(--warm-deep)}
html[data-palette] .option{border-color:var(--warm-line);background:#fff}
html[data-palette] .option.selected{border-color:var(--warm-main);background:#fff;box-shadow:0 0 0 1px var(--warm-main)}
html[data-palette] .option>svg{color:var(--warm-deep)}
html[data-palette] .option.selected>svg{color:var(--warm-main)}
html[data-palette] .option .option-check{border-color:var(--warm-line)}
html[data-palette] .option.selected .option-check{background:var(--warm-main);border-color:var(--warm-main)}
html[data-palette] .progress-track i{background:var(--warm-line)}
html[data-palette] .progress-track i.done{background:var(--warm-main)}
html[data-palette] .trust-box{background:var(--warm-soft);border:1px solid var(--warm-line)}
html[data-palette] .soft-note{background:var(--warm-soft);border:1px solid var(--warm-line)}
html[data-palette] .empty{background:var(--warm-soft);border:1px solid var(--warm-line)}

/* ── G. 내비·레일 ──────────────────────────────────────────── */
html[data-palette] .topbar{border-bottom:1px solid var(--warm-line)}
html[data-palette] .side-nav a{color:var(--warm-ink)}
html[data-palette][data-design=b] .side-nav a.active{background:var(--warm-main);color:#fff;font-weight:700;box-shadow:none}
html[data-palette][data-design=b] .audience-switch a[aria-current=page]{background:var(--warm-main);color:#fff;font-weight:700;box-shadow:none}
html[data-palette] .audience-switch{background:#fff;border:1px solid var(--warm-line);padding:var(--g-1)}
html[data-palette] .audience-switch a{min-height:var(--touch);padding:0 var(--g-4);color:var(--warm-ink)}
html[data-palette] .nav-count{
  margin-left:auto;background:var(--warm-line);color:var(--warm-sub);
  min-width:22px;height:22px;display:grid;place-items:center;padding:0 var(--g-1);font-weight:700;
}
html[data-palette] .side-nav a.active .nav-count{background:rgba(255,255,255,.26);color:#fff}
html[data-palette] .sidebar-separator{background:var(--warm-line);height:1px;margin:var(--g-4) 0}
html[data-palette] .side-foot{background:var(--warm-soft);border:1px solid var(--warm-line);padding:var(--g-4)}
html[data-palette] .side-foot .tiny-arrow{
  display:inline-flex;align-items:center;gap:var(--g-1);margin-top:var(--g-3);
  min-height:var(--touch);font-weight:700;color:var(--warm-deep);
}
html[data-palette] .rail-card,html[data-palette] .rail-note{background:#fff;border:1px solid var(--warm-line);padding:var(--g-4)}
html[data-palette] .rail-card .primary{width:100%}
html[data-palette] .calendar-week{color:var(--warm-sub)}
html[data-palette] .calendar-day{color:var(--warm-ink);font-weight:600}
html[data-palette] .calendar-result strong{color:var(--warm-ink);font-weight:700}
html[data-palette] .calendar-result span{color:var(--warm-deep);font-weight:700}
html[data-palette] .calendar-note{color:var(--warm-sub);font-weight:400}
/* 광고 지면 — §8: 라벨은 항상 좌상단, 숨기거나 작게 만들지 않는다 */
html[data-palette] .ad-preview-slot{border:1px solid var(--warm-line);background:#fff;padding:var(--g-4)}
html[data-palette] .ad-slot-head{padding-bottom:var(--g-3);border-bottom:1px solid var(--warm-line)}
html[data-palette] .ad-slot-head .ad-label{background:#E8E7E4;color:#3D3933;border-radius:4px;padding:var(--g-1) var(--g-2);font-weight:600}
html[data-palette] .ad-creative{background:var(--warm-soft);border:1px solid var(--warm-line);padding:var(--g-4)}
html[data-palette] .ad-creative h3{font-size:var(--t-section-size);line-height:var(--t-section-lh);font-weight:600;color:var(--warm-ink)}
html[data-palette] .ad-creative p,html[data-palette] .ad-creative>span{font-size:var(--t-caption-size);line-height:var(--t-caption-lh);color:var(--warm-sub)}
html[data-palette] .ad-persona{border-color:var(--warm-line);min-height:var(--touch);font-size:var(--t-caption-size)}
html[data-palette] .ad-persona-label{color:var(--warm-sub);font-weight:500}
html[data-palette] .own-services{border-top-color:var(--warm-line)}
html[data-palette] .own-services h3{font-size:var(--t-caption-size);line-height:var(--t-caption-lh);font-weight:700;color:var(--warm-ink)}
html[data-palette] .sv-promo-heading small{color:var(--warm-sub)}
html[data-palette] .sv-promo-dots button i{background:var(--warm-line)}

/* ── H. 성장 솔루션 — 남아 있던 찬 색 마저 정리 + 자체 일러스트 투입 ──
   style.css 336·340·349행의 초록 7색은 별도로 황토 토큰으로 치환했다(공통규격 C-1).
   여기서는 그 외 파랑·남색·보라 잔재를 정리한다. */
html[data-palette] .growth-service-proof{color:var(--warm-deep);font-weight:600}
html[data-palette] .growth-hero-foot{border-top-color:var(--warm-line);color:var(--warm-sub)}
html[data-palette] .sv-art--certification,
html[data-palette] .sv-art--website,
html[data-palette] .sv-art--video{color:var(--warm-deep)}
html[data-palette] .growth-partner-photo figcaption strong,
html[data-palette] .growth-partner-photo figcaption strong span{color:var(--warm-ink)}
html[data-palette] .growth-partner-photo figcaption>span{color:var(--warm-sub)}
html[data-palette] .growth-partner-photo figcaption a,
html[data-palette] .growth-text-link,
html[data-palette] .growth-rail-note strong,
html[data-palette] .growth-play,
html[data-palette] .sv-card-cta{color:var(--warm-deep);font-weight:600}
html[data-palette] .growth-video-label{background:rgba(44,38,25,.86)}
html[data-palette] .growth-closing p,html[data-palette] .growth-partner p{color:var(--warm-sub)}
html[data-palette] .sv-paid{background:#fff;border:1px solid var(--warm-line);padding:var(--g-1) var(--g-3);color:var(--warm-deep);font-weight:600}
html[data-palette] .sv-card{background:#fff;border:1px solid var(--warm-line);overflow:hidden}
html[data-palette] .sv-card h2{color:var(--warm-ink)}
html[data-palette] .sv-card p{color:var(--warm-sub)}
/* assets/visuals 3장이 숨겨진 광고 캐러셀에만 쓰이고 서비스 카드 상단은 빈 면이었다.
   공고 카드에는 절대 넣지 않는다 — 공고 원문에 대표 이미지가 없어 지어내야 하므로. */
html[data-palette] .sv-art--visual{
  background:var(--warm-soft)!important;border-bottom:1px solid var(--warm-line);
  overflow:hidden;padding:0!important;
}
html[data-palette] .sv-art--visual img{
  display:block;width:100%;height:100%;object-fit:cover;object-position:center 56%;mix-blend-mode:multiply;
}

/* ── I. 여백 리듬 (공통규격 §1) ───────────────────────────────
   실측 18/14/10/26/20/20/14/14/16/40 → 한 화면 3종(16/24/32)으로. */
html[data-palette] .preview-status{border-bottom:1px solid var(--warm-line);padding:var(--g-3) 0;margin-bottom:var(--g-5);color:var(--warm-sub)}
html[data-palette] .preview-status b{
  display:inline-flex;align-items:center;height:24px;padding:0 var(--g-2);
  background:var(--warm-line);color:var(--warm-sub);border-radius:var(--r-pill);
  margin-right:var(--g-2);font-weight:600;
}
@media(min-width:900px){
  html[data-palette] .visual-hero{margin-bottom:var(--g-5)}
  html[data-palette] .audience-switch{margin-bottom:var(--g-3)}
  html[data-palette] .search{margin-bottom:0}
  html[data-palette] .match-banner{margin-bottom:var(--g-6)}
  html[data-palette] .section-heading{margin-bottom:var(--g-4)}
  html[data-palette] .filter-row{margin-bottom:var(--g-4)}
  html[data-palette] .results-meta{margin-bottom:var(--g-4)}
  html[data-palette] .footer{margin-top:var(--g-7)}
}
html[data-palette] .footer{border-top:1px solid var(--warm-line);padding-top:var(--g-5);color:var(--warm-sub)}
html[data-palette] .footer strong{color:var(--warm-ink);font-weight:600}
html[data-palette] .brand-footer-logo{display:inline-flex;align-items:center;min-height:var(--touch)}

/* ── J. 반응형 (공통규격 §10: 분기 3개) ───────────────────────── */
@media(max-width:899px){
  html[data-palette] .notice-card .card-link h3{font-size:var(--t-body-size);line-height:var(--t-body-lh);min-height:0}
  html[data-palette] .audience-switch a,
  html[data-palette] .filter-row .pill,
  html[data-palette] .filter-row select,
  html[data-palette] .trending button,
  html[data-palette] .ad-persona,
  html[data-palette] .side-foot .tiny-arrow,
  html[data-palette] .growth-text-link,
  html[data-palette] .growth-partner-photo figcaption a,
  html[data-palette] .more,
  html[data-palette][data-design=b] .match-banner>a{min-height:var(--touch)}
  html[data-palette] .footer a{min-width:var(--touch);justify-content:center}
  html[data-palette] .subtle-link{min-width:var(--touch);justify-content:center}
  html[data-palette] .category{min-width:var(--touch)}
  html[data-palette] .logo,html[data-palette] .brand-footer-logo{min-height:var(--touch)}
}
@media(max-width:540px){
  /* 절대배치 히어로는 글이 짧으면 아래가 비고 패딩을 줄이면 글 위로 부엉이가 겹쳤다. 2열로. */
  html[data-palette] .brand-discovery{
    display:grid!important;grid-template-columns:minmax(0,1fr) 116px;align-items:end;
    column-gap:var(--g-3);min-height:0!important;padding:var(--g-4)!important;border-radius:var(--r-2);
  }
  html[data-palette] .brand-discovery .discovery-copy{grid-column:1}
  html[data-palette] .brand-discovery .discovery-art{
    position:static!important;grid-column:2;align-self:end;
    width:116px!important;height:132px!important;right:auto!important;bottom:auto!important;top:auto!important;
  }
  html[data-palette] .brand-discovery p{max-width:100%!important;margin-bottom:0}
  html[data-palette] .brand-discovery h1{font-size:var(--t-title-size)!important;line-height:var(--t-title-lh);letter-spacing:-.02em}
  html[data-palette] .brand-discovery p{font-size:var(--t-sub-size)!important;line-height:var(--t-sub-lh)}
  html[data-palette] .visual-hero .eyebrow{background:none;border:0;padding:0;margin-bottom:var(--g-3);white-space:nowrap}
  html[data-palette] .brand-page-hero h1,html[data-palette] .growth-hero h1{font-size:var(--t-title-size);line-height:var(--t-title-lh)}
  html[data-palette] .section-heading h2,html[data-palette] .detail-head h1,
  html[data-palette] .profile-page h1{font-size:var(--t-title-size);line-height:var(--t-title-lh)}
  html[data-palette] .categories{padding:var(--g-3);margin:var(--g-4) 0 var(--g-5)}
  html[data-palette] .category .cat-icon{width:44px;height:44px}
  html[data-palette] .match-banner h2{font-size:var(--t-body-size);line-height:var(--t-body-lh)}
}

/* ── K. 규격 밖 잔여값 정리 (부록 B 자가점검 결과) ─────────────────
   실측으로 남은 것: 15px/650 상단메뉴, 19px/740 솔루션 카드 제목,
   19px 문의 패널 제목, 650/550 굵기 7종, radius 3·7px. */
html[data-palette] .top-links a{font-size:var(--t-sub-size);line-height:var(--t-sub-lh);font-weight:600}
html[data-palette] .top-links a.active{font-weight:700}
html[data-palette] .trending b{font-size:var(--t-caption-size);line-height:var(--t-caption-lh);font-weight:600;color:var(--warm-sub)}
html[data-palette] .sv-card h2,
html[data-palette] .rail-profile h2,
html[data-palette] .rail-title h2,
html[data-palette] .support-panel header h2{
  font-size:var(--t-section-size);line-height:var(--t-section-lh);font-weight:600;letter-spacing:-.01em;
}
html[data-palette] .deadline-item h3{font-size:var(--t-caption-size);line-height:var(--t-caption-lh);font-weight:600;color:var(--warm-ink)}
html[data-palette] .deadline-date b{font-weight:700;color:var(--warm-deep);font-variant-numeric:tabular-nums}
html[data-palette] .support-launcher span{font-weight:700}
html[data-palette] .sv-promo-heading small{border-radius:var(--r-1)}
html[data-palette] .rail-title button,
html[data-palette] .calendar-toolbar button,
html[data-palette] .calendar-toolbar input{border-radius:var(--r-1)}
/* 사이드 각주는 180px 열에서 14px이면 "가까이."가 줄바꿈으로 깨진다 → 캡션 13px */
html[data-palette] .side-foot{font-size:var(--t-caption-size);line-height:var(--t-caption-lh)}
html[data-palette] .side-foot b{font-size:var(--t-sub-size);line-height:var(--t-sub-lh)}

/* ── L. 375px·성장 솔루션 화면의 규격 밖 잔여값 ────────────────── */
html[data-palette] .sv-promo-slide h2,
html[data-palette] .sv-promo-slide>a>div,
html[data-palette] .growth-partner h2,
html[data-palette] .growth-work-copy h3,
html[data-palette] .growth-section-head h2,
html[data-palette] .growth-closing h2{
  font-size:var(--t-section-size);line-height:var(--t-section-lh);font-weight:600;letter-spacing:-.01em;color:var(--warm-ink);
}
html[data-palette] .growth-hero h1,
html[data-palette] .growth-hero h1 em{font-size:var(--t-title-size);line-height:var(--t-title-lh)}
@media(min-width:900px){
  html[data-palette] .growth-hero h1,
  html[data-palette] .growth-hero h1 em{font-size:var(--t-display-size);line-height:var(--t-display-lh)}
}
html[data-palette] .growth-partner-photo figcaption strong,
html[data-palette] .growth-section-head p,
html[data-palette] .growth-work-copy p,
html[data-palette] .sv-faq summary,
html[data-palette] .sv-faq p{font-size:var(--t-sub-size);line-height:var(--t-sub-lh)}
html[data-palette] .growth-partner-photo figcaption strong{font-weight:700}
html[data-palette] .sv-faq summary{font-weight:600;color:var(--warm-ink);min-height:var(--touch)}
html[data-palette] .sv-mini-label{font-size:var(--t-caption-size);line-height:var(--t-caption-lh);font-weight:600;color:var(--warm-sub)}
html[data-palette] .growth-tags span{border-radius:var(--r-1);font-size:var(--t-caption-size);line-height:var(--t-caption-lh);font-weight:500}
html[data-palette] .growth-channel{border-radius:var(--r-2)}
html[data-palette] .mobile-nav a span{font-weight:600}
html[data-palette] .mobile-nav a.active span{font-weight:700;color:var(--warm-main)}

/* ── M. 특이도가 높은 잔여 규칙 덮기 (portfolio-reference.css 등) ── */
html[data-palette] .growth-work[aria-label] .growth-section-head h2,
html[data-palette] .growth-work .growth-section-head h2{font-size:var(--t-title-size);line-height:var(--t-title-lh);font-weight:700;letter-spacing:-.02em}
html[data-palette] .growth-work[aria-label] .growth-section-head p,
html[data-palette] .growth-work[aria-label] .growth-work-copy p,
html[data-palette] .growth-work .growth-work-copy p{font-size:var(--t-sub-size);line-height:var(--t-sub-lh);color:var(--warm-sub)}
html[data-palette] .growth-work[aria-label] .growth-work-copy h3,
html[data-palette] .growth-work .growth-work-copy h3{font-size:var(--t-section-size);line-height:var(--t-section-lh);font-weight:600;letter-spacing:-.01em;color:var(--warm-ink)}
html[data-palette] .growth-work .growth-tags span,
html[data-palette] .growth-work[aria-label] .growth-tags span{border-radius:var(--r-1)}
html[data-palette] .profile-page .step-meta b{font-weight:700;color:var(--warm-deep)}
/* app.js 인라인 style="font-size:20px" 을 클래스로 바꾸고 규격 단계로 맞춘다 */
html[data-palette] .page-subhead{
  font-size:var(--t-section-size);line-height:var(--t-section-lh);font-weight:600;
  letter-spacing:-.01em;color:var(--warm-ink);margin-bottom:var(--g-5);
}

/* ── N. !important 로 박혀 있던 규격 밖 글자 크기 ────────────────
   style.css .growth-section-head h2 (26px!important / 23px!important),
   portfolio-reference.css .growth-work-copy h3 21px!important / p 15px!important. */
html[data-palette] .growth-work .growth-section-head h2,
html[data-palette] .growth-work[aria-label] .growth-section-head h2{
  font-size:var(--t-title-size)!important;line-height:var(--t-title-lh);font-weight:700;letter-spacing:-.02em;
}
html[data-palette] .growth-work .growth-work-copy h3,
html[data-palette] .growth-work[aria-label] .growth-work-copy h3{
  font-size:var(--t-section-size)!important;line-height:var(--t-section-lh);font-weight:600;letter-spacing:-.01em;
}
html[data-palette] .growth-work .growth-work-copy p,
html[data-palette] .growth-work[aria-label] .growth-work-copy p,
html[data-palette] .growth-work .growth-section-head p,
html[data-palette] .growth-work[aria-label] .growth-section-head p{
  font-size:var(--t-sub-size)!important;line-height:var(--t-sub-lh)!important;color:var(--warm-sub);
}
html[data-palette] .growth-partner h2,
html[data-palette] .growth-closing h2,
html[data-palette] .sv-faq h2{font-size:var(--t-section-size)!important;line-height:var(--t-section-lh);font-weight:600}
html[data-palette] .growth-hero h1,html[data-palette] .growth-hero h1 em{font-size:var(--t-title-size)!important;line-height:var(--t-title-lh)}
@media(min-width:900px){
  html[data-palette] .growth-hero h1,html[data-palette] .growth-hero h1 em{font-size:var(--t-display-size)!important;line-height:var(--t-display-lh)}
}
/* 광고 캐러셀 점(dot)은 알약으로 */
html[data-palette] .sv-promo-dots button i{border-radius:var(--r-pill)}
html[data-palette] .growth-video-label{border-radius:var(--r-1)}
/* 공통규격 §9-3: ≤899px 클릭 요소 44px. 빵부스러기 링크가 34x24로 남아 있었다. */
@media(max-width:899px){
  html[data-palette] .breadcrumb a{display:inline-flex;align-items:center;min-height:var(--touch);min-width:var(--touch);justify-content:center}
  html[data-palette] .breadcrumb{align-items:center}
}
/* 공통규격 §3: 그림자는 2단계뿐. 문의 패널·토스트에 찬 색 그림자 3종이 남아 있었다. */
html[data-palette] .support-launcher,
html[data-palette] .support-panel,
html[data-palette] #toast>div,
html[data-palette] #toast{box-shadow:var(--sh-2)}

/* ── O. 상세 페이지 머리도 목록 카드와 같은 배지·칩 체계로 ───────── */
html[data-palette] .detail-head .card-top{align-items:center;gap:var(--g-2);min-height:24px;margin-bottom:var(--g-4)}
html[data-palette] .detail-head .card-category{
  border:1px solid var(--warm-line);border-radius:var(--r-1);
  padding:0 var(--g-2);height:24px;display:inline-flex;align-items:center;
  background:#fff;color:var(--warm-sub);
  font-size:var(--t-caption-size);line-height:var(--t-caption-lh);font-weight:500;
}
html[data-palette] .detail-head{padding:var(--g-5)}
html[data-palette] .detail-facts{
  background:var(--warm-soft);border-radius:var(--r-1);padding:var(--g-4);
  border-top:0;margin-top:var(--g-5);
}
html[data-palette] .detail-source{color:var(--warm-sub)}
@media(max-width:899px){html[data-palette] .detail-head{padding:var(--g-4)}}
html[data-palette] .detail-section summary{font-weight:600;font-size:var(--t-caption-size);line-height:var(--t-caption-lh);color:var(--warm-ink)}
html[data-palette] .sv-promo-dots button{border-radius:var(--r-pill)}
html[data-palette] .sv-promo-controls button{border-radius:var(--r-pill)}
/* ══════════════════════════════════════════════════════════════════════
   [배치 효율 · 2026-09-16 · 배치 효율화 부장] 밀도·동선 레이어
   공통규격 v1 §12에 따라 새 CSS 파일을 만들지 않고 이 파일 끝에 붙였습니다.
   여기부터 파일 끝까지가 배치 부장이 추가한 전부입니다.
   간격은 §1의 4·8·12·16·24·32·48·64 만, 반경은 §2의 8·12·20·알약만,
   분기점은 §10의 540 / 899 / 1280 만 썼습니다.
   함께 추가한 파일: public/layout-density.js (구조 재배치 전용, 문구 무변경)

   조사 근거
   - 기업마당 지원사업 공고 목록: 표 15행/페이지, 필터는 목록 위 가로 바,
     번호 페이지네이션. (bizinfo.go.kr 목록 화면 직접 확인)
   - K-Startup 사업공고: 카드 리스트 15~20건/페이지, 필터·정렬 상단,
     번호 페이지네이션. (k-startup.go.kr/web/contents/bizpbanc-ongoing.do)
     → 초기 노출 8건 → 12건, 필터를 목록 바로 위 한 덩어리로 모은 근거.
   - NN/g "Fight Against Right-Rail Blindness": 우측 레일은 가용 픽셀의 약 20%를
     쓰며, 광고처럼 보이는 것은 무시당한다. 보조 콘텐츠만 두고 시각적으로
     가볍게 하라. → 레일을 뷰포트 안에 들어오게 줄여 sticky 를 살린 근거.
   - UX for the Masses "Why filter bars are better than left-hand filters" /
     Setproduct "Filter UI design: Sidebar vs top bar": 가로 필터 바는 결과와
     붙어 있어 놓치지 않고, 사이드 필터는 접히거나 폴드 밖으로 밀린다.
   - NN/g "Scrolling and Attention": 주목의 80%가 폴드 위에 머문다.
     → 첫 화면 공고 0건이던 상태를 최우선으로 고친 근거.
   - "Mobile Filter and Sort UX" / Mobbin bottom-sheet 정리: 모바일은 결과가
     항상 보이도록 필터를 목록 위 한 줄로 고정하고 칩은 가로로 흘린다.
   ══════════════════════════════════════════════════════════════════════ */

/* ── 1. 작업 영역: 레일이 먹던 가로를 본문으로 되돌린다 (≥1280, §10) ── */
@media (min-width: 1280px) {
  .workspace { grid-template-columns: 160px minmax(0, 1fr) 224px; gap: 24px; padding: 16px 32px 48px; }
  .sidebar { top: 16px; }
  /* 레일이 grid 라 내용 최소폭(262px)이 열 폭을 밀어내 가로 넘침 8px 이 있었다. */
  .right-rail { top: 16px; gap: 12px; grid-template-columns: minmax(0, 1fr);
                max-height: calc(100vh - 32px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
  .right-rail > * { min-width: 0; }
  .calendar-toolbar input { width: auto; flex: 1 1 auto; min-width: 0; }
}
/* ── 2. 상단 블록 압축 ── */
.preview-status { margin: 0 0 12px; padding: 8px 0; }
  .visual-hero h1 { font-size: 24px; line-height: 1.42; }
  .visual-hero p { font-size: 16px; line-height: 1.5; margin-top: 8px; max-width: none; }
  .visual-hero .eyebrow { margin-bottom: 8px; }
}
/* 대상 전환 탭 + 검색을 한 줄로 (세로 두 블록 → 하나) */
.ld-findbar { display: grid; gap: 8px; margin-bottom: 12px; }
@media (min-width: 900px) {
  .ld-findbar { grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px; }
  .ld-findbar .audience-switch { margin: 0; border-bottom: 0; gap: 16px; flex-shrink: 0; }
  .ld-findbar .audience-switch a { padding: 0 4px; min-height: 44px; border-bottom-width: 2px; }
  .ld-findbar .search { margin: 0; }
}
/* 분야 칩: 아이콘 위·글자 아래 2단(129px) → 한 줄 칩
   §9-7 대로 흰 면 + warm-line 테두리로 '누를 수 있음'을 알린다.
   아이콘 타일의 연한 황색 면은 클릭 영역 안이라 투명으로 바꿨다. */
.categories.has-groups { gap: 16px; padding: 0; margin: 0 0 12px; align-items: center; flex-wrap: wrap; overflow: visible; }
.categories.has-groups .category-group { grid-template-columns: none; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.categories.has-groups .category-group-label { grid-column: auto; margin: 0; flex: 0 0 auto; font-size: 13px; }
.categories .category { flex-direction: row; gap: 8px; min-height: 44px; padding: 0 12px; border: 1px solid var(--m-line); border-radius: 8px; background: #fff; white-space: nowrap; }
.categories .category .cat-icon { width: 20px; height: 20px; border-radius: 8px; background: transparent; }
.categories .category .cat-icon svg { width: 16px; height: 16px; }
.categories .category > span:last-child { font-size: 14px; }
html[data-palette] .categories .category { background: #fff; }
html[data-palette] .categories .category .cat-icon { background: transparent; }
html[data-palette] .categories .category.selected { border-color: var(--warm-main); box-shadow: inset 0 0 0 1px var(--warm-main); color: var(--warm-deep); font-weight: 600; }
html[data-palette] .categories .category.selected .cat-icon { color: var(--warm-main); box-shadow: none; }
/* 내 조건 배너: 레일이 보이는 폭(≥1280)에서는 레일 첫 카드와 안내·버튼이
   같아 중복이다. 레일이 사라지는 1279px 이하에서는 그대로 둔다. */
@media (min-width: 1280px) { .match-banner { display: none; } }
@media (max-width: 1279px) {
  .match-banner { padding: 12px 16px; margin-bottom: 16px; gap: 12px; }
  .match-symbol { width: 32px; height: 32px; }
}
/* ── 3. 결과 툴바: 제목·필터·정렬·건수를 목록 바로 위에 고정 ── */
.ld-toolbar { position: sticky; top: 0; z-index: 12; background: var(--m-page); padding: 8px 0; margin-bottom: 12px; border-bottom: 1px solid var(--m-line); }
.ld-toolbar .ld-toolbar-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ld-toolbar .section-heading { display: contents; }
.ld-toolbar .section-heading h2 { order: 1; flex: 0 1 auto; font-size: 18px; line-height: 27px; font-weight: 600; white-space: nowrap; }
/* 필터 줄 최소 요구폭 640px — 칩 4개 + 지역/정렬 셀렉트가 한 줄에 필요한 실측 폭이다.
   1440px 에서는 제목·초기화와 같은 줄에 남고, 1280px 에서는
   통째로 다음 줄로 내려간다. 줄 안에서 어중간하게 접혀 3줄이 되는 것을 막는다. */
.ld-toolbar .filter-row { order: 2; flex: 1 1 640px; min-width: 0; margin: 0; }
.ld-toolbar .section-heading .subtle-link { order: 3; flex: 0 0 auto; margin-left: auto; min-height: 44px; }
.ld-toolbar .results-meta { margin: 4px 0 0; }
/* ── 4. 카드 압축: 항목 7개(마감 배지·분류·제목·지역·마감일·출처 기관·근거)를
   하나도 빼지 않고 세로만 줄인다. 지역·마감 줄과 출처·근거 줄을 한 줄로 합쳤다. ── */
section[aria-label="공고 목록"] .notice-card { padding: 16px; }
section[aria-label="공고 목록"] .card-top { gap: 8px; }
section[aria-label="공고 목록"] .badge { min-height: 24px; padding: 0 8px; display: inline-flex; align-items: center; }
section[aria-label="공고 목록"] .card-link { padding-top: 8px; padding-right: 48px; }
/* 어딘가에서 display 가 flow-root 로 덮여 line-clamp 가 꺼져 있었고,
   그래서 3번째 줄이 반쯤 잘린 채 보였다. 2줄에서 말줄임으로 끊는다(§4). */
section[aria-label="공고 목록"] .card-link h3 { font-size: 16px; line-height: 24px; font-weight: 600; letter-spacing: -0.01em;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 0; height: 48px; }
section[aria-label="공고 목록"] .card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 12px;
  font-size: 13px; line-height: 19px; font-weight: 500; letter-spacing: -0.4px; color: var(--m-muted); font-variant-numeric: tabular-nums; }
section[aria-label="공고 목록"] .card-meta > span { display: inline-flex; align-items: center; gap: 4px; }
section[aria-label="공고 목록"] .card-meta svg { width: 13px; height: 13px; }
section[aria-label="공고 목록"] .card-meta .source-name { max-width: none; }
section[aria-label="공고 목록"] .save-button { top: 8px; right: 8px; }
html[data-design=b] section[aria-label="공고 목록"] .notice-grid { padding: 12px; gap: 12px; }
/* 열 수는 분기점이 아니라 카드 최소폭으로 정한다(§10의 분기점 4개를 늘리지 않기 위해서다).
   한 장 최소 280px — 그 아래로 내려가면 공고 제목이 12건 전부 두 줄에서 잘린다(1280px 실측).
   본문 929px(1440) → 3열 294px, 본문 769px(1280) → 2열 366px 로 알아서 접힌다. */
@media (min-width: 541px) {
  html[data-design=b] section[aria-label="공고 목록"] .notice-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
}
/* ── 5. 우측 레일: 뷰포트보다 짧게 만들어 sticky 가 실제로 붙게 한다 ──
   전 1441px(뷰포트 900보다 큼) → 첫 스크롤 뒤 광고·캘린더가 영영 안 보였다. */
.right-rail .rail-card { padding: 16px; }
.right-rail .rail-card h2 { line-height: 1.4; }
.right-rail .rail-card > p { margin-top: 8px; line-height: 1.5; }
.right-rail .rail-card .primary { margin-top: 12px; }
.right-rail .ad-preview-slot { padding: 12px; }
.right-rail .ad-slot-head { gap: 8px; }
.right-rail .ad-persona-label { margin-top: 8px; }
.right-rail .ad-persona { min-height: 36px; margin-top: 4px; }
.right-rail .ad-creative { padding: 12px; margin-top: 8px; }
.right-rail .ad-creative h3 { font-size: 16px; line-height: 1.5; margin: 8px 0; }
.right-rail .ad-creative p { line-height: 1.5; }
.deadline-calendar .rail-title { margin-bottom: 8px; }
.deadline-calendar .rail-title h2 { line-height: 1.35; }
.deadline-calendar .calendar-toolbar button { height: 32px; }
.deadline-calendar .calendar-range { margin: 4px 0 8px; }
.deadline-calendar .calendar-day { min-height: 44px; padding: 4px 0; gap: 0; line-height: 1.3; }
.deadline-calendar .calendar-day span { font-size: 13px; line-height: 1.25; }
.deadline-calendar .calendar-day small { font-size: 13px; line-height: 1.2; }
.deadline-calendar .calendar-week { margin-bottom: 8px; }
.deadline-calendar .calendar-result { margin-top: 4px; padding: 0 0 4px; }
.deadline-calendar .calendar-source-note { margin: 4px 0 0; font-size: 13px; line-height: 19px; }
.deadline-calendar .calendar-note { margin-top: 8px; font-size: 13px; line-height: 19px; }
.deadline-calendar .calendar-results { max-height: 232px; }
/* 마감 공고 목록 접기 — 요약(날짜·건수)은 접어도 계속 보인다 */
.ld-rail-toggle { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-height: 44px;
  margin-top: 4px; padding: 0 12px; border: 1px solid var(--m-line); border-radius: 8px; font-size: 13px; font-weight: 600; background: #fff; color: var(--m-text); }
.ld-rail-toggle .ld-caret { transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1); }
.ld-rail-toggle[aria-expanded="true"] .ld-caret { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .ld-rail-toggle .ld-caret { transition: none; } }
/* 레일 하단 안내 카드는 모든 페이지에 똑같이 반복되는 정적 설명이라
   NN/g 가 레일에 두지 말라고 한 바로 그 콘텐츠다. 목록 아래로 옮기면
   레일이 뷰포트 안에 들어오고, 레일이 숨는 1279px 이하에서는 그동안
   아예 보이지 않던 안내가 처음으로 보이게 된다. */
.ld-note-below { margin-top: 16px; padding: 16px; border: 1px solid var(--m-line); border-radius: 12px; background: #fff; }
.ld-note-below h3 { font-size: 14px; line-height: 21px; margin-bottom: 4px; }
.ld-note-below p, .ld-note-below small { font-size: 13px; line-height: 19px; }
.ld-note-below small { display: block; margin-top: 4px; }
/* ── 6. 태블릿(541~899) · 모바일(≤540) 재배치 ── */
@media (max-width: 1279px) {
  /* 한 줄에 욱여넣으면 세 줄로 접혀 오히려 높아진다(실측 141px).
     제목·초기화 한 줄, 필터 한 줄로 명확히 끊는다. */
  .ld-toolbar .ld-toolbar-row { gap: 8px 12px; }
  .ld-toolbar .section-heading h2 { order: 1; flex: 0 1 auto; min-width: 0; }
  .ld-toolbar .section-heading .subtle-link { order: 2; margin-left: auto; }
  .ld-toolbar .filter-row { order: 3; flex: 1 0 100%; }
}
@media (max-width: 899px) {
  .preview-status { padding: 4px 0; margin-bottom: 8px; }
  .ld-findbar { gap: 8px; margin-bottom: 8px; }
  .ld-findbar .audience-switch { margin: 0; }
  .ld-findbar .audience-switch a { padding: 0 0 8px; min-height: 44px; }
  .categories.has-groups { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; padding-bottom: 4px; margin-bottom: 8px; gap: 12px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .categories.has-groups::-webkit-scrollbar { display: none; }
  .categories.has-groups .category-group { flex-wrap: nowrap; }
  /* 툴바 2줄: [제목 ···· 건수] / [필터 칩 ── 조건 초기화]
     '조건 초기화'는 칩 가로 스크롤 밖에 고정해 항상 손에 닿는다(44px). */
  .ld-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 8px 0; margin-bottom: 8px; }
  .ld-toolbar .ld-toolbar-row, .ld-toolbar .section-heading { display: contents; }
  .ld-toolbar .section-heading h2 { order: 1; flex: 0 1 auto; font-size: 16px; line-height: 24px; }
  .ld-toolbar .results-meta { order: 2; flex: 1 1 120px; justify-content: flex-end; text-align: right; margin: 0; font-size: 13px; line-height: 19px; }
  .ld-toolbar .filter-row { order: 3; flex: 1 1 180px; min-width: 0; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; padding-bottom: 4px; }
  .ld-toolbar .filter-row::-webkit-scrollbar { display: none; }
  .ld-toolbar .filter-row > * { flex: 0 0 auto; }
  .ld-toolbar .filter-row .filter-spacer { display: none; }
  .ld-toolbar .section-heading .subtle-link { order: 4; flex: 0 0 auto; margin: 0; min-height: 44px; }
  .ld-toolbar .filter-row .pill, .ld-toolbar .filter-row select { min-height: 44px; }
  .preview-status a { min-height: 44px; }
}
  /* 고정 툴바의 '보관 자료 · 기준일'은 같은 화면 안에서 세 번째 표기다
     (본문 맨 위 미리보기 줄, 푸터, 그리고 여기). 두 곳에 그대로 남는다. */
  .ld-toolbar .results-meta > span:last-child { display: none; }
  section[aria-label="공고 목록"] .notice-card { padding: 16px; }
}
/* 실측 후 조정 (같은 규격 안에서 한 단계만 조임)
   - 카드 메타: tabular-nums 가 '09.16' 을 넓혀 299px 카드에서 두 줄로 접혔다.
     §4의 tabular-nums 지정 대상은 금액·D-day·건수라 메타에서는 뺀다. 굵기도 400.
     두 줄 → 한 줄, 카드 168px → 145px.
   - 분야 칩: 좌우 padding 12 → 8 로 줄여 941px 본문에서 두 줄 → 한 줄(104 → 44px).
   - 미리보기 줄: 상하 padding 8 → 4. */
section[aria-label="공고 목록"] .card-meta { font-weight: 400; font-variant-numeric: normal; }
.categories .category { padding: 0 8px; }
.categories.has-groups .category-group { gap: 8px; }
.preview-status { padding: 4px 0; }
.right-rail .rail-card { padding: 12px; }
.right-rail .rail-card .primary { margin-top: 8px; }
.right-rail .ad-creative { margin-top: 8px; }
.right-rail .ad-creative h3 { margin: 4px 0; }
@media (min-width: 1280px) { .deadline-calendar .calendar-day { min-height: 32px; } }
/* 출처 기관을 배지 줄로 올린 자리 — 배지·분류와 같은 13px 라벨 층이다. */
section[aria-label="공고 목록"] .card-top { flex-wrap: nowrap; min-width: 0; }
section[aria-label="공고 목록"] .card-top .ld-source-top { margin-left: auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; line-height: 19px; color: var(--m-muted); }
section[aria-label="공고 목록"] .card-category { white-space: nowrap; }
/* 출처 기관과 관심 저장 아이콘 사이 간격, 광고 라벨 줄바꿈 정리.
   광고 라벨(§8)은 줄여서는 안 되므로 좁은 레일에서는 두 줄로 흘린다. */
/* 관심 저장 아이콘과의 간격은 .card-top 의 padding-right(24px) 로 준다.
   출처 텍스트에 margin 을 더하면 300px 카드에서 분류가 4px 모자라 잘린다. */
section[aria-label="공고 목록"] .card-top { padding-right: 24px; }
.right-rail .ad-slot-head { flex-wrap: wrap; row-gap: 8px; }
.right-rail .ad-inquiry { margin-left: auto; white-space: nowrap; }
/* 배지·분류·출처가 300px 카드 위쪽 한 줄에 말줄임 없이 들어가도록 간격 4px. */
section[aria-label="공고 목록"] .card-top { gap: 4px; }
}
/* 태블릿(541~899)에서도 대상 탭과 검색창을 한 줄로 — 768px 에서 세로 60px 절약. */
@media (min-width: 541px) {
  .ld-findbar { grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px; }
  .ld-findbar .audience-switch { margin: 0; border-bottom: 0; gap: 16px; flex-shrink: 0; }
  .ld-findbar .audience-switch a { padding: 0 4px; min-height: 44px; border-bottom-width: 2px; }
  .ld-findbar .search { margin: 0; }
/* ══════════════════════════════════════════════════════════════════════
   [2026-09-16 상품설명 부장 round01] 공고 카드 정보 충실도 · 가치 제안 · 솔루션 설득력
   공통규격 v1 준수: 간격 4/8/12/16/24/32/48 · 반경 8/12 · 타이포 6단계 ·
   굵기 400/500/600/700 · 분기 540/899 · 색은 warm 토큰만.
   ══════════════════════════════════════════════════════════════════════ */

/* 1) 히어로 아래 수록 범위·자료 기준 (신뢰 근거) */
.trust-strip{
  list-style:none;margin:0 0 8px;padding:16px;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;
  border:1px solid var(--warm-line);border-radius:12px;background:#fff;
}
.trust-strip li{min-width:0;display:flex;flex-direction:column;gap:4px}
.trust-strip b{
  font-size:18px;line-height:27px;font-weight:700;letter-spacing:-.01em;
  color:var(--warm-ink);font-variant-numeric:tabular-nums;
}
.trust-strip span{font-size:13px;line-height:19px;font-weight:500;color:var(--warm-sub)}
.trust-caption{
  display:flex;align-items:flex-start;gap:8px;margin:0 0 24px;
  font-size:13px;line-height:19px;font-weight:500;color:var(--warm-sub);
}
.trust-caption b{color:var(--warm-ink);font-weight:600}
.trust-caption svg{width:16px;height:16px;flex-shrink:0;margin-top:4px;color:var(--warm-main)}

/* 2) 공고 카드 — 보관 자료에 있는 대상·지원 내용을 카드에서 바로 */
.card-facts{margin:12px 0 0;display:grid;gap:4px}
.card-facts>div{display:grid;grid-template-columns:56px minmax(0,1fr);gap:8px;align-items:baseline}
.card-facts dt{font-size:13px;line-height:19px;font-weight:500;color:var(--warm-sub);white-space:nowrap}
.card-facts dd{
  margin:0;font-size:14px;line-height:21px;color:var(--warm-ink);min-width:0;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;
}
.card-facts dd.is-unknown{color:var(--warm-sub)}
.notice-card .card-details{flex-wrap:wrap;margin-top:12px;column-gap:12px;row-gap:4px}
.notice-card .card-details span{min-width:0;font-variant-numeric:tabular-nums}
html[data-design=b] .notice-card .card-details{font-size:14px;line-height:21px;column-gap:12px;row-gap:4px}
.suggestion-grid .card-facts dd{-webkit-line-clamp:2}

/* 3) 공고 상세 — 한눈에 보기 6칸, 결측은 결측으로, 첨부는 출처 기관 서버로 */
.detail-facts{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:24px;column-gap:16px}
.detail-facts dd{font-size:14px;line-height:21px;overflow-wrap:anywhere}
.detail-facts dd.is-unknown{font-weight:400;color:var(--warm-sub)}
.detail-unknown{font-size:13px;line-height:19px;font-weight:500;color:var(--warm-sub);margin:0 0 8px}
.detail-raw{margin-top:8px}
.detail-raw summary{
  min-height:44px;display:flex;align-items:center;gap:8px;
  font-size:14px;line-height:21px;font-weight:600;color:var(--warm-ink);cursor:pointer;
}
.detail-raw summary svg{width:16px;height:16px}
.detail-raw p{margin-top:8px;padding:16px;background:var(--warm-bg);border-radius:8px}
.detail-files{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.detail-files a{
  display:flex;align-items:center;gap:8px;min-height:44px;
  font-size:14px;line-height:21px;color:var(--warm-ink);
  text-decoration:underline;text-underline-offset:4px;overflow-wrap:anywhere;
}
.detail-files svg{width:16px;height:16px;flex-shrink:0;color:var(--warm-sub)}

/* 4) 성장 솔루션 — 받는 결과물, 그리고 "왜 여기서" */
.sv-card-deliverables{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.sv-card-deliverables li{
  display:inline-flex;align-items:center;gap:4px;
  font-size:13px;line-height:19px;font-weight:500;color:var(--warm-ink);
  border:1px solid var(--warm-line);border-radius:8px;padding:4px 8px;background:#fff;
}
.sv-card-deliverables svg{width:16px;height:16px;flex-shrink:0;color:var(--warm-main)}
.sv-detail-deliverables{margin:16px 0}

.growth-why{margin:48px 0}
.growth-why-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.growth-why article{min-width:0;border:1px solid var(--warm-line);border-radius:12px;background:#fff;padding:24px}
.growth-why article>span{
  display:block;font-size:13px;line-height:19px;font-weight:500;letter-spacing:.06em;
  color:var(--warm-main);margin-bottom:8px;font-variant-numeric:tabular-nums;
}
.growth-why h3{font-size:18px;line-height:27px;font-weight:600;letter-spacing:-.01em;color:var(--warm-ink);margin-bottom:8px}
.growth-why p{font-size:14px;line-height:21px;color:var(--warm-sub);overflow-wrap:anywhere}
.growth-why p b{color:var(--warm-ink);font-weight:600}
.growth-why .growth-caption{margin-top:16px}

/* 5) 분기 — 공통규격 §10 (540 / 899) */
@media(max-width:899px){
  .detail-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .growth-why-grid{grid-template-columns:1fr}
  /* 모바일 터치 영역 44px 하한선 보정 — 기존 화면에 24~28px로 남아 있던 링크들 */
  .breadcrumb a,
  .growth-partner figcaption a,
  .growth-text-link,
  .growth-learn a{display:inline-flex;align-items:center;min-height:44px}
}
@media(max-width:540px){
  .trust-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:16px}
  .trust-caption{margin-bottom:16px}
  .card-facts{margin-top:12px}
  .card-facts>div{grid-template-columns:56px minmax(0,1fr)}
  .card-facts dd{font-size:14px;line-height:21px;-webkit-line-clamp:2}
  .detail-facts{grid-template-columns:1fr;row-gap:16px}
  .growth-why{margin:32px 0}
  .growth-why article{padding:16px}
}