/* 홈 전용 — 00.html 에서만 씀. 공통 부품(카드·로고 띠·CTA)은 site.css 그대로 */

/* 메인 영상 — 옛 홈처럼 영상만 꽉 차게(자막이 영상 안에 있음), 제목은 아래 띠로 (인아님 10-26) */
.home-hero{background:#0b0f18 url(../img/home/hero-poster.jpg) center/cover;overflow:hidden}
.home-hero > video{display:block;width:100%;height:auto;aspect-ratio:2520/1170;max-height:78vh;object-fit:cover}
.home-intro{padding:64px 0 72px;text-align:center;border-bottom:1px solid var(--line)}
.home-intro h1{font-size:40px;line-height:1.3;letter-spacing:-.01em}
.home-intro p{margin:16px auto 0;max-width:640px;font-size:18px;line-height:1.6;color:var(--muted)}
.home-intro .btns{justify-content:center;margin-top:28px}
@media (prefers-reduced-motion:reduce){.home-hero > video{visibility:hidden}}
@media (max-width:640px){.home-intro{padding:40px 0 48px}.home-intro h1{font-size:28px}.home-intro p{font-size:16px}}

/* 서비스 영역 아래 원고 00 의 안내 한 줄 + 버튼 */
.home-ask{margin-top:48px;padding-top:32px;border-top:1px solid var(--line)}
.home-ask p{font-size:17px;font-weight:600;color:var(--ink)}
.home-ask .btns{margin-top:20px}

/* 고객사 로고: 사업실적 페이지와 같은 흐르는 두 줄 */
.sec.paper .logo-flow{margin-top:40px}

/* 최근 산업안전 정보: 블로그 카드 3장 한 줄 */
.home-recent .blog-cards{grid-template-columns:repeat(3,1fr)}
@media (max-width:1024px){.home-recent .blog-cards{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.home-recent .blog-cards{grid-template-columns:1fr}}

/* 비즈니스 제휴·파트너 — 제목 없이 1행 2열(인아님 10-26 「더 줄이고 싶다」), 위아래 진한 선 */
.home-partner.sec{padding:56px 0}
.hp-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
.hp-list li{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.hp-list a{display:grid;grid-template-columns:minmax(0,1fr) 24px;gap:6px 16px;padding:22px 0;color:var(--ink);text-decoration:none}
.hp-t{font-size:17px;font-weight:700;line-height:1.45}
.hp-t small{display:block;margin-top:4px;font-size:13px;font-weight:400;color:var(--muted)}
.hp-d{grid-column:1;margin-top:6px;font-size:15px;line-height:1.6;color:var(--muted)}
.hp-list i{grid-row:1/3;grid-column:2;align-self:center;font-size:20px;color:var(--accent-text)}
.hp-list a:hover .hp-t{color:var(--accent-text)}
@media (max-width:900px){.hp-list{grid-template-columns:minmax(0,1fr);gap:0}.hp-list li + li{border-top:0}}

/* ② 영상 위 버튼 — 영상 가운데 자막 바로 아래, 영상 톤에 맞춘 반투명(인아님 10-26). 휴대폰은 영상이 낮아 아래 띠 버튼만 */
.home-hero{position:relative}
.hero-btns{position:absolute;left:0;right:0;top:61%;z-index:1;display:flex;justify-content:center;gap:12px;opacity:0;animation:hb-in .9s .6s var(--ease) forwards}
.hero-btns .btn{min-width:150px;min-height:48px;padding:8px 22px;font-size:15px;border-radius:999px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.hb-main{background:rgba(255,255,255,.92);color:var(--ink);border:1px solid rgba(255,255,255,.92)}
.hb-main:hover{background:#fff}
.hb-sub{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.6)}
.hb-sub:hover{background:rgba(255,255,255,.18)}
@keyframes hb-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.home-intro .btns{display:none}
@media (prefers-reduced-motion:reduce){.hero-btns{animation:none;opacity:1}}
@media (max-width:640px){.hero-btns{display:none}.home-intro .btns{display:flex}}

/* 서비스 구역 「가」 — 5열×2줄 타일, 법적 의무 문단은 홈에서 뺌(각 서비스 페이지에만), 알파벳 코드 대신 아이콘 */
.svc-tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:36px}
.svc-tile{display:flex;flex-direction:column;gap:8px;padding:22px 18px;background:#fff;border:1px solid var(--line);border-radius:12px;color:var(--ink);text-decoration:none;transition:border-color .15s var(--ease),box-shadow .15s var(--ease)}
.svc-tile:hover{border-color:var(--accent);box-shadow:0 6px 18px rgba(27,77,255,.08)}
.svc-tile i{font-size:28px;color:var(--accent-text)}
.svc-tile b{margin-top:4px;font-size:16px;line-height:1.4}
.svc-tile span{flex:1;font-size:13.5px;line-height:1.6;color:var(--muted)}
.svc-tile em{font-style:normal;font-size:13px;font-weight:700;color:var(--accent-text)}
@media (max-width:1024px){.svc-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.svc-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.svc-tile{padding:16px 14px}.svc-tile span{display:none}}