/* I-25 홈 디자인 다듬기 (additive). 변수는 home.css의 것을 쓰고 가격·문구 숫자는 건드리지 않는다. */
/* 1) 첫 화면 바로 아래 "무엇을 해 드리나요" 한 줄 요약 */
.hero-strip{background:var(--raised);border-bottom:1px solid var(--line)}
.hero-strip ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.hero-strip li+li{border-left:1px solid var(--line)}
.hero-strip a{display:block;min-height:44px;padding:28px 32px;color:var(--ink);text-decoration:none;transition:background .2s}
.hero-strip a:hover{background:var(--surface)}
.hero-strip b{display:flex;justify-content:space-between;gap:12px;font:700 18px/28px var(--sans)}
.hero-strip b::after{content:"↓";font-weight:400;color:var(--ink-muted)}
.hero-strip span{display:block;margin-top:4px;font-size:15px;line-height:24px;color:var(--ink-muted)}
.hero-strip a:focus-visible{outline:3px solid var(--ink);outline-offset:-3px}
/* 2) 진단 시작 구역: 문장과 버튼 사이 간격, 보조 버튼 모양 */
.btn-outline{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn-outline:hover{border-color:var(--ink)}
#growth-entry .sec-lede{max-width:640px;margin-bottom:28px}
#growth-entry .cta-row{align-items:center}
#growth-entry .cta-row .link{min-height:44px;display:inline-flex;align-items:center}
@media (max-width:760px){
  .hero-strip ul{grid-template-columns:1fr}
  .hero-strip li+li{border-left:0;border-top:1px solid var(--line)}
  .hero-strip a{padding:18px 4px}
  /* 3) 비교표: 좁은 화면에서는 좌우로 밀지 않고 항목별로 쌓아 읽는다 */
  .compare-scroll{overflow:visible;margin:0;padding:0}
  .compare-table,.compare-table tbody,.compare-table tfoot,.compare-table tr,.compare-table th,.compare-table td{display:block;min-width:0;width:auto}
  .compare-table caption{display:none}
  .compare-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .compare-table tbody tr{padding:20px 0;border-bottom:1px solid var(--line)}
  .compare-table tbody th{width:auto;padding:0 0 4px;border:0;font-size:15px;color:var(--ink)}
  .compare-table tbody td{padding:10px 0 0;border:0}
  .compare-table tbody td::before{content:attr(data-label);display:block;font:700 13px/20px var(--sans);color:var(--ink-muted)}
  .compare-table tfoot tr{padding-top:16px}
  .compare-table tfoot td{padding:0;border:0}
  .compare-table tfoot td.sr{display:none}
}
.compare-table td .link,.compare-help .link{display:inline;min-height:0;padding:0}
/* 포트폴리오 카드: 기단의 모바일 이미지는 위쪽 벽면만 잘려 흐려 보이므로 공간과 글자가 있는 중간쪽을 보여 준다 */
@media (max-width:760px){.works img[src*="gidan"]{object-position:50% 58%}}
@media (min-width:761px) and (max-width:1023px){
  .hero-strip a{padding:24px 20px}
  .hero-strip b{font-size:16px;line-height:24px}
  .hero-strip span{font-size:14px;line-height:22px}
  /* 태블릿: 표가 화면에 맞게 들어오도록 줄이고 좌우로 밀지 않게 한다 */
  .compare-table{min-width:0;table-layout:fixed;font-size:15px;line-height:23px}
  .compare-table th,.compare-table td{padding:16px 12px}
  .compare-table tbody th{width:96px}
  .compare-table caption{display:none}
}
/* 공통: 터치 대상 44px, 보조 글자 14px 이상 */
.foot-nav a{display:inline-flex;align-items:center;min-height:44px}
.top .brand{display:inline-flex;align-items:center;min-height:44px}
.eyebrow,.eyebrow span,.kicker,.service-state,.facts span{font-size:14px;line-height:22px}
.foot .foot-nav a{min-height:44px;font-size:14px}
.sub-hero .facts span{font-size:14px;line-height:20px}
.eyebrow .en,.steps .n,.card .n,.docs li span,.cap,.plan .vat,.extra-cost p{font-size:14px}
.foot .biz,.copy,.vcap{font-size:14px}
@media (min-width:1024px){.sub-hero .facts span{white-space:nowrap}.sub-hero .facts li{padding-right:12px;margin-right:12px}}
/* /web 접이식 보조 구역 */
.fold-more{margin-top:28px;border-top:1px solid var(--line)}
.fold-more>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;font-weight:700;font-size:17px;line-height:26px;padding:12px 0}
.fold-more>summary::-webkit-details-marker{display:none}
.fold-more>summary::after{content:"+";font-size:26px;line-height:1;color:var(--ink-muted);flex:0 0 auto}
.fold-more[open]>summary::after{content:"−"}
.fold-more>summary:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.fold-more>.sub-h:first-of-type{display:none}
@media (min-width:861px){.fold-more{border-top:0;margin-top:8px}.fold-more>summary{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;padding:0;min-height:0;pointer-events:none}.fold-more>.sub-h:first-of-type{display:block}}
