/* 메인 v8 — 가운데 정렬 원페이지 흐름. 후기·대표 소개·FAQ는 기존 스타일 그대로 사용 */
@font-face{font-family:SUIT;src:url('suit-v8.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
:root{--h8-g:#14532d;--h8-g2:#1f9d55;--h8-g3:#0a5a30;--h8-mint:#dcfce7;--h8-red:#dc2626;--h8-ink:#111;--h8-gray:#5f6b64;--h8-line:#e5ebe7}
.h8{text-align:center}
.h8-wrap{width:calc(100% - 48px);max-width:960px;margin:auto}
.h8-sec{padding:112px 0}
.h8-tag{display:inline-block;font-size:13px;font-weight:800;letter-spacing:.14em;color:var(--h8-g2);margin-bottom:18px}
.h8 h2{font-size:clamp(28px,4.2vw,44px);font-weight:900;line-height:1.35;letter-spacing:-.04em;color:var(--h8-ink)}
.h8-lead{margin:20px auto 0;max-width:600px;font-size:clamp(16px,2vw,19px);line-height:1.8;color:var(--h8-gray)}
.h8-lead b{color:var(--h8-ink);font-weight:800}
.h8 .red{color:var(--h8-red)}
.h8 .grn{color:var(--h8-g2)}
.h8-btn{display:inline-flex;align-items:center;gap:10px;background:var(--h8-g);color:#fff;font-weight:800;font-size:17px;padding:18px 34px;border-radius:999px;box-shadow:0 14px 32px #14532d33;transition:transform .2s,box-shadow .2s}
.h8-btn:hover{transform:translateY(-3px);box-shadow:0 20px 40px #14532d44}
.h8-btn svg,.h8-more svg{width:17px;height:17px;stroke:currentColor;stroke-width:2.4;fill:none;transition:transform .2s}
.h8-btn:hover svg,.h8-more:hover svg{transform:translateX(4px)}
.h8-ghost{display:inline-flex;align-items:center;padding:17px 30px;border-radius:999px;border:1.5px solid #d4dcd7;font-weight:800;font-size:16px;color:var(--h8-ink);transition:border-color .2s}
.h8-ghost:hover{border-color:var(--h8-ink)}
.h8-more{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-weight:800;color:var(--h8-g2);font-size:16px}

/* 등장 효과 */
.h8 .rv{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.h8 .rv.in{opacity:1;transform:none}

/* 1. 히어로 */
.h8-hero{position:relative;min-height:calc(100svh - 66px);display:flex;flex-direction:column;justify-content:center;padding:48px 0 130px;background:#fff}
.h8-hero .h8-tag{color:var(--h8-gray);letter-spacing:.02em;font-size:15px;font-weight:700}
.h8-hero h1{font-size:clamp(38px,6.4vw,70px);font-weight:900;line-height:1.28;letter-spacing:-.045em;color:var(--h8-ink)}
.h8-hero h1 em{font-style:normal;color:var(--h8-red)}
.h8-hero .h8-lead{margin-top:26px}
.h8-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:48px}
.h8-trust{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:40px}
.h8-trust span{font-size:14px;font-weight:700;color:#4b5550;border:1px solid var(--h8-line);background:#fafcfb;padding:8px 16px;border-radius:999px}
.h8-hero>*>*{animation:h8up .9s cubic-bezier(.2,.75,.25,1) both}
.h8-hero h1{animation-delay:.1s}.h8-hero .h8-lead{animation-delay:.3s}.h8-cta{animation-delay:.5s}.h8-trust{animation-delay:.7s}
@keyframes h8up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

/* 2. 실제 계정 숫자 */
.h8-turn{background:var(--h8-g);color:#fff}
.h8-turn .h8-tag{color:#86efac}
.h8-turn h2{color:#fff}
.h8-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:48px 0 44px}
.h8-num{background:#fff;border-radius:20px;padding:26px 20px;border-top:4px solid var(--h8-g2);box-shadow:0 18px 44px #0000003d}
.h8-num i{display:block;font-style:normal;font-size:14px;font-weight:800;color:#6b7280;margin-bottom:6px}
.h8-num b{font-size:clamp(32px,4.8vw,48px);font-weight:900;letter-spacing:-.03em;color:var(--h8-ink)}
.h8-num.zero{border-top-color:var(--h8-red)}
.h8-num.zero i,.h8-num.zero b{color:var(--h8-red)}
.h8-num.flash{animation:h8flash .9s ease 1}
@keyframes h8flash{45%{box-shadow:0 0 0 8px #dc26264d,0 18px 44px #0000003d}}
.h8-turn p{font-size:clamp(17px,2.2vw,20px);line-height:1.85;color:#ffffffd1}
.h8-turn p b{color:#fff;font-weight:800}
.h8-turn p+p{margin-top:18px}

/* 3. 쪼개진 구조 vs 한 손 */
.h8-split{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:52px;text-align:left}
.h8-card{background:#fff;border:1px solid var(--h8-line);border-radius:22px;padding:30px 28px;box-shadow:0 20px 44px #0000000f}
.h8-card>i{display:inline-block;font-style:normal;font-size:13px;font-weight:800;padding:5px 12px;border-radius:999px;margin-bottom:18px}
.h8-card.bad>i{background:#fef2f2;color:#b91c1c}
.h8-card.good{border:2px solid var(--h8-g2)}
.h8-card.good>i{background:var(--h8-mint);color:var(--h8-g)}
.h8-card ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.h8-card li{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;font-weight:700;font-size:15.5px}
.h8-card li small{margin-left:auto;font-size:13px;font-weight:700}
.h8-card.bad li{background:#f7f7f8;color:#52525b}
.h8-card.bad li small{color:#a1a1aa}
.h8-card.good li{background:#f0fdf4;color:var(--h8-g)}
.h8-card.good li small{color:var(--h8-g2)}
.h8-card p{margin-top:18px;font-size:15px;font-weight:700;line-height:1.6}
.h8-card.bad p{color:#b91c1c}
.h8-card.good p{color:var(--h8-g)}

/* 4. 서비스 */
.h8-svc{background:#f5f8f6}
.h8-svc-list{display:grid;gap:22px;margin-top:52px}
.h8-svc-item{background:#fff;border:1px solid var(--h8-line);border-radius:26px;padding:44px 40px 40px;box-shadow:0 20px 44px #0000000d}
.h8-svc-item .no{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:12px;background:var(--h8-g);color:#fff;font-weight:900;font-size:16px;margin-bottom:16px}
.h8-svc-item h3{font-size:clamp(23px,3vw,30px);font-weight:900;letter-spacing:-.04em;line-height:1.4;color:var(--h8-ink)}
.h8-svc-item h3 small{display:block;font-size:14px;font-weight:800;letter-spacing:.02em;color:var(--h8-g2);margin-bottom:6px}
.h8-svc-item>p{margin:12px auto 0;max-width:560px;font-size:16.5px;line-height:1.75;color:var(--h8-gray)}
.h8-chips{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.h8-chips span{font-size:13.5px;font-weight:700;padding:6px 13px;border-radius:999px;background:#f0fdf4;color:var(--h8-g)}
.h8-shot{display:block;margin:28px auto 0;max-width:760px;border:1px solid var(--h8-line);border-radius:14px;overflow:hidden;box-shadow:0 16px 36px #0000001a;cursor:zoom-in;transition:transform .25s}
.h8-shot:hover{transform:translateY(-3px)}
.h8-shot img{width:100%;display:block}
.h8-pay{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:24px auto 0;max-width:560px;background:var(--h8-g);color:#fff;border-radius:16px;padding:16px 20px;font-size:15.5px;font-weight:700}
.h8-pay b{font-size:22px;font-weight:900;color:#86efac}
.h8-pay a{margin-left:4px;background:#fff;color:var(--h8-g);padding:8px 16px;border-radius:999px;font-size:14px;font-weight:800}
.h8-extra{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}
.h8-extra a{display:flex;align-items:center;gap:14px;text-align:left;background:#fff;border:1px solid var(--h8-line);border-radius:20px;padding:22px 24px;transition:transform .2s,box-shadow .2s}
.h8-extra a:hover{transform:translateY(-3px);box-shadow:0 16px 36px #0000001a}
.h8-extra b{display:block;font-size:17px;font-weight:900;color:var(--h8-ink)}
.h8-extra span{font-size:14px;color:var(--h8-gray);line-height:1.55}
.h8-extra svg{flex:none;margin-left:auto;width:18px;height:18px;stroke:var(--h8-g2);stroke-width:2.4;fill:none}

/* 5. 성과 숫자 */
.h8-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.h8-metric{background:#fff;border:1px solid var(--h8-line);border-radius:22px;padding:28px 20px}
.h8-metric i{display:block;font-style:normal;font-size:14px;font-weight:800;color:var(--h8-gray)}
.h8-metric s{display:block;text-decoration:none;margin-top:10px;font-size:15px;color:#9ca3af;font-weight:700}
.h8-metric b{display:block;font-size:clamp(34px,4.6vw,46px);font-weight:900;letter-spacing:-.03em;color:var(--h8-g);line-height:1.25}
.h8-metric em{display:inline-block;margin-top:8px;font-style:normal;font-size:13.5px;font-weight:800;color:var(--h8-g2);background:#f0fdf4;padding:4px 12px;border-radius:999px}
.h8-note{margin-top:16px;font-size:13px;color:#8a968c}
.h8-proof #proof{padding-top:36px}
.h8-proof .reviews{text-align:left}

/* 6. 진행 순서 */
.h8-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px;text-align:left;counter-reset:s}
.h8-step{position:relative;background:#fff;border:1px solid var(--h8-line);border-radius:22px;padding:28px 24px}
.h8-step .no{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:var(--h8-g2);color:#fff;font-weight:900;margin-bottom:16px}
.h8-step b{display:block;font-size:20px;font-weight:900;margin-bottom:6px;color:var(--h8-ink)}
.h8-step p{font-size:15.5px;line-height:1.7;color:var(--h8-gray)}

/* 기존 고정 버튼 숨김 */
.sticky-cta{display:none!important}

/* ── 오른쪽 플로팅 버튼 ── */
.h8-rail{position:fixed;right:22px;bottom:24px;z-index:60;display:flex;flex-direction:column;gap:6px;padding:8px;background:#ffffffe6;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid #e3e9e5;border-radius:22px;box-shadow:0 18px 44px #0f2a1a26;transition:bottom .45s cubic-bezier(.2,.8,.2,1),opacity .3s,transform .3s}
.h8-rail a{display:flex;align-items:center;gap:10px;min-width:150px;padding:11px 16px 11px 11px;border-radius:15px;font-size:14.5px;font-weight:800;color:var(--h8-ink);transition:background .2s,transform .2s}
.h8-rail a:hover{background:#f0f5f2;transform:translateX(-2px)}
.h8-rail .ic{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:11px;flex:none}
.h8-rail .ic svg{width:18px;height:18px}
.h8-rail .pay .ic{background:#f0fdf4;color:var(--h8-g2)}
.h8-rail .pay .ic svg{stroke:currentColor;stroke-width:2;fill:none}
.h8-rail .kko .ic{background:#fee500;color:#191919}
.h8-rail .kko .ic svg{fill:currentColor}
.h8-rail a.chk{background:var(--h8-g);color:#fff;margin-top:2px}
.h8-rail a.chk:hover{background:#0f4424}
.h8-rail .chk .ic{background:#ffffff26;color:#fff}
.h8-rail .chk .ic svg{stroke:currentColor;stroke-width:2.2;fill:none}
.h8-rail small{display:block;font-size:11.5px;font-weight:700;opacity:.7;line-height:1.3}
body.h8-bar-on .h8-rail{bottom:108px}

/* ── 하단 안내 배너 ── */
.h8-bar{position:fixed;left:50%;bottom:-160px;transform:translateX(-50%);z-index:61;display:flex;align-items:center;gap:16px;background:var(--h8-g3);color:#fff;padding:14px 14px 14px 24px;border-radius:18px;box-shadow:0 20px 48px #00000047;transition:bottom .5s cubic-bezier(.2,.8,.2,1);width:max-content;max-width:min(92vw,580px)}
.h8-bar.on{bottom:22px}
.h8-bar p{font-size:15px;line-height:1.5}
.h8-bar p b{font-weight:800}
.h8-bar a{background:#fff;color:var(--h8-g3);font-weight:800;font-size:14.5px;padding:11px 20px;border-radius:999px;white-space:nowrap;flex:none}
.h8-bar button{background:none;border:0;color:#ffffffa6;font-size:16px;padding:4px 6px;flex:none}
.h8-bar button:hover{color:#fff}

/* 반응형 */
@media(max-width:1100px){.h8-bar{left:24px;transform:none;max-width:calc(100vw - 250px)}}
@media(max-width:760px){
 .h8-sec{padding:76px 0}
 .h8-hero{padding:72px 0 68px}
 .h8-wrap{width:calc(100% - 32px)}
 .h8-split,.h8-steps,.h8-extra{grid-template-columns:1fr}
 .h8-nums{gap:8px;margin:32px 0}.h8-num{padding:16px 6px;border-radius:14px}.h8-num i{font-size:12px}.h8-num b{font-size:22px}
 .h8-svc-item{padding:32px 20px 24px;border-radius:22px}


 /* 모바일: 오른쪽 버튼 → 하단 고정 막대 */
 .h8-rail{left:10px;right:10px;bottom:10px;flex-direction:row;gap:6px;padding:6px;border-radius:18px}
 .h8-rail a{flex:1;min-width:0;flex-direction:column;gap:3px;padding:8px 4px;font-size:12.5px;justify-content:center;text-align:center}
 .h8-rail a:hover{transform:none}
 .h8-rail .ic{width:28px;height:28px;border-radius:9px}
 .h8-rail small{display:none}
 .h8-rail a.chk{margin-top:0}
 body.h8-bar-on .h8-rail{bottom:10px}
 .h8-bar{left:10px;right:10px;transform:none;width:auto;max-width:none;padding:12px 10px 12px 16px;gap:10px}
 .h8-bar.on{bottom:94px}
 .h8-bar p{font-size:13.5px}
 .h8-bar a{padding:9px 14px;font-size:13px}
 footer{padding-bottom:calc(110px + env(safe-area-inset-bottom))!important}
}
@media(prefers-reduced-motion:reduce){.h8 .rv{opacity:1;transform:none;transition:none}.h8-hero>*>*{animation:none}.h8-bar,.h8-rail{transition:none}}
.h8-proof{background:#f5f8f6}

/* 히어로 아래 안내 */
.h8-down{position:absolute;left:0;right:0;margin:auto;width:max-content;bottom:34px;display:flex;flex-direction:column;align-items:center;gap:10px;font-size:14.5px;font-weight:800;color:var(--h8-gray);white-space:nowrap;animation:h8up .9s .9s both}
.h8-down i{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--h8-g);box-shadow:0 10px 24px #14532d40;animation:h8bob 1.8s ease-in-out infinite}
.h8-down svg{width:20px;height:20px;stroke:#fff;stroke-width:2.6;fill:none}
.h8-down:hover{color:var(--h8-g)}
@keyframes h8bob{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}

/* 따로 맡기면 vs 마케팁 — 흐름 그림 */
.h8-card{padding:28px 26px 26px}
.h8-flow{display:flex;align-items:center;margin:4px 0 22px}
.h8-flow .node{flex:none;width:92px;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.h8-flow .ico{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:18px;margin-bottom:4px}
.h8-flow .ico svg{width:26px;height:26px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.h8-flow b{font-size:15px;font-weight:800;color:var(--h8-ink);line-height:1.3}
.h8-flow small{font-size:12.5px;font-weight:700;line-height:1.3}
.h8-flow .link{flex:1;position:relative;height:0;margin-top:-44px}
.h8-card.bad .ico{background:#f4f4f5;color:#71717a}
.h8-card.bad .node.end .ico{background:#fef2f2;color:var(--h8-red)}
.h8-card.bad small{color:#a1a1aa}
.h8-card.bad .node.end small{color:var(--h8-red)}
.h8-card.bad .link{border-top:2px dashed #fca5a5}
.h8-card.bad .link em{position:absolute;left:50%;top:-12px;transform:translateX(-50%);width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid #fca5a5;color:var(--h8-red);font-style:normal;font-size:11px;font-weight:900;display:flex;align-items:center;justify-content:center}
.h8-card.good .ico{background:#dcfce7;color:var(--h8-g)}
.h8-card.good .node.end .ico{background:var(--h8-g2);color:#fff;box-shadow:0 10px 22px #1f9d5540}
.h8-card.good small{color:var(--h8-g2)}
.h8-card.good .link{border-top:2.5px solid var(--h8-g2)}
.h8-card.good .link:after{content:'';position:absolute;right:-2px;top:-7.5px;border:6px solid transparent;border-left:8px solid var(--h8-g2)}
.h8-out{border-radius:16px;padding:18px 20px}
.h8-out b{display:block;font-size:18px;font-weight:900;letter-spacing:-.03em;margin-bottom:4px}
.h8-out span{display:block;font-size:14.5px;line-height:1.65}
.h8-card.bad .h8-out{background:#fef2f2}
.h8-card.bad .h8-out b{color:#b91c1c}
.h8-card.bad .h8-out span{color:#7f1d1d}
.h8-card.good .h8-out{background:var(--h8-g)}
.h8-card.good .h8-out b{color:#fff}
.h8-card.good .h8-out span{color:#ffffffd9}

/* 성과 + 원본 화면 + 후기 */
.h8-ba{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px;text-align:left}
.h8-ba figure{margin:0;background:#fff;border:1px solid var(--h8-line);border-radius:18px;padding:14px}
.h8-ba figcaption{display:inline-block;font-size:13px;font-weight:800;padding:4px 12px;border-radius:999px;background:#f4f4f5;color:#52525b;margin-bottom:10px}
.h8-ba .is-after{border:2px solid var(--h8-g2)}
.h8-ba .is-after figcaption{background:var(--h8-g2);color:#fff}
.h8-ba .shot{display:block;border-radius:10px;overflow:hidden;border:1px solid var(--h8-line);cursor:zoom-in}
.h8-ba .shot span{display:none}
.h8-sub{margin-top:64px;font-size:clamp(22px,2.8vw,28px);font-weight:900;letter-spacing:-.04em;color:var(--h8-ink)}
.h8-reviews{margin-top:26px}.h8-reviews .reviews{margin-top:0}
.h8-reviews .reviews{text-align:left}

/* 7. 신청 */
.h8-offer{background:radial-gradient(900px 420px at 50% 0,#1c6b3d 0,#0e2d1c 60%,#0b2216 100%);color:#fff}
.h8-offer .h8-tag{color:#86efac}
.h8-offer h2{color:#fff}
.h8-offer h2 em{font-style:normal;color:#4ade80}
.h8-offer .h8-lead{color:#ffffffc7}
.h8-promise{max-width:600px;margin:36px auto;background:#ffffff0f;border:1px solid #ffffff26;border-radius:18px;padding:22px 26px;display:flex;align-items:center;gap:16px;text-align:left}
.h8-promise:before{content:'✓';flex:none;width:40px;height:40px;border-radius:50%;background:#4ade80;color:#0b2216;font-weight:900;font-size:18px;display:flex;align-items:center;justify-content:center}
.h8-promise i{display:block;font-style:normal;font-size:13px;font-weight:800;color:#86efac;margin-bottom:2px}
.h8-promise p{font-size:16.5px;line-height:1.65;color:#ffffffd9}
.h8-promise p b{color:#fff}
.h8-offer .h8-btn{background:#4ade80;color:#062e17;box-shadow:0 16px 36px #4ade8040}
.h8-offer .h8-btn:hover{box-shadow:0 20px 44px #4ade8059}
.h8-offer .mini{margin-top:18px;font-size:14.5px;color:#ffffffa6}
.h8-offer .mini a{color:#fff;border-bottom:1px solid #ffffff66}

@media(max-width:760px){
 .h8-hero{min-height:calc(100svh - 60px);padding:24px 0 190px}
 .h8-down{bottom:100px;font-size:13.5px}
 .h8-metrics{gap:8px}.h8-metric{padding:16px 4px;border-radius:14px}.h8-metric i{font-size:11.5px}.h8-metric s{font-size:12px;margin-top:6px}.h8-metric b{font-size:21px}.h8-metric em{font-size:11px;padding:3px 7px}
 .h8-flow .node{width:74px}
 .h8-flow .ico{width:48px;height:48px;border-radius:15px}
 .h8-flow .link{margin-top:-40px}
 .h8-ba{grid-template-columns:1fr}
 .h8-sub{margin-top:48px}
 .h8-promise{padding:18px}
}
/* 3D 이모지 아이콘 */
.h8-flow .ico{position:relative;width:72px;height:72px;border-radius:22px}
.h8-flow .ico img{width:48px;height:48px;object-fit:contain;filter:drop-shadow(0 6px 8px #0000001f)}
.h8-flow .link{margin-top:-52px}
.h8-card.bad .ico,.h8-card.bad .node.end .ico{background:#f4f4f5}
.h8-card.bad .ico img{filter:grayscale(1) opacity(.55)}
.h8-card.good .ico{background:linear-gradient(160deg,#f0fdf4,#dcfce7)}
.h8-card.good .node.end .ico{background:linear-gradient(160deg,#dcfce7,#bbf7d0);box-shadow:0 10px 22px #1f9d5533}
.h8-flow .badge{position:absolute;top:-6px;right:-6px;width:24px;height:24px;border-radius:50%;font-style:normal;font-size:13px;font-weight:900;color:#fff;display:flex;align-items:center;justify-content:center;border:2px solid #fff}
.h8-card.bad .badge{background:var(--h8-red)}
.h8-card.good .badge{background:var(--h8-g2)}
@media(max-width:760px){.h8-flow .ico{width:60px;height:60px;border-radius:18px}.h8-flow .ico img{width:40px;height:40px}.h8-flow .link{margin-top:-46px}}
/* 포인트 초록(#1f9d55) 통일 */
#about h2 .ink-mark{color:var(--h8-g2);background:none}
.h8-metric b{color:var(--h8-g2)}
.h8-card.good .h8-out{background:var(--h8-g2)}
.h8-card.good .h8-out span{color:#fffffff0}
.h8-svc-item .no{background:var(--h8-g2)}
#faq h2{color:var(--h8-ink)}
/* 버튼·플로팅도 포인트 초록 */
.h8-btn{background:var(--h8-g2);box-shadow:0 14px 32px #1f9d5540}
.h8-btn:hover{box-shadow:0 20px 40px #1f9d5559}
.h8-down i{background:var(--h8-g2);box-shadow:0 10px 24px #1f9d5540}
.h8-bar{background:var(--h8-g2);box-shadow:0 20px 48px #1f9d5559}
.h8-bar a{color:var(--h8-g2)}
.h8-bar button{color:#ffffffcc}
.h8-rail a.chk{background:var(--h8-g2)}
.h8-rail a.chk:hover{background:#188a49}
/* 핵심 강조는 빨강·주황, 초록은 포인트로만 */
:root{--h8-org:#ea580c}
.h8 .org{color:var(--h8-org)}
.h8-pay{background:#fff7ed;color:#7c2d12;border:1.5px solid #fed7aa}
.h8-pay b{color:var(--h8-org)}
.h8-pay a{background:var(--h8-org);color:#fff}
.h8-svc-item .no{background:var(--h8-ink)}
.h8-bar{background:#166534;box-shadow:0 20px 48px #16653452}
.h8-bar a{color:#166534}
/* 페이백 띠: 네이버·카카오 로고 */
.h8-pay{gap:14px;padding:14px 16px 14px 14px}
.h8-logos{display:inline-flex;flex:none}
.h8-logos i{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:11px;box-shadow:0 4px 10px #0000001f;border:2px solid #fff}
.h8-logos i+i{margin-left:-8px}
.h8-logos .nv{background:#03c75a}
.h8-logos .nv svg{width:15px;height:15px;fill:#fff}
.h8-logos .kk{background:#fee500}
.h8-logos .kk svg{width:21px;height:21px;fill:#3c1e1e}
.h8-pay a{margin-left:0}
@media(max-width:760px){.h8-pay{flex-direction:column;gap:8px;padding:16px}}
.h8-pay b{white-space:nowrap}
.h8-pay b small{font-size:15.5px;font-weight:700;color:#7c2d12}
/* 브랜드블로그·전자책 카드 이미지 */
.h8-extra a{gap:18px;padding:18px 22px 18px 18px;min-height:104px}
.h8-extra-ic{flex:none;display:flex;align-items:center;justify-content:center;width:68px;height:68px;border-radius:20px;background:linear-gradient(160deg,#fff7ed,#ffedd5)}
.h8-extra-ic img{width:46px;height:46px;filter:drop-shadow(0 6px 8px #0000001f)}
.h8-extra-book{flex:none;width:52px;height:74px;border-radius:5px;object-fit:cover;box-shadow:0 8px 18px #00000033;transform:rotate(-4deg);margin:0 8px 0 6px}
/* 실제 계정 숫자 섹션: 밝은 초록 */
.h8-turn{background:linear-gradient(165deg,#22a95c 0%,#1f9d55 45%,#178a4a 100%)}
.h8-turn .h8-tag{color:#fff;background:#ffffff26;padding:6px 14px;border-radius:999px;letter-spacing:.06em}
.h8-turn p{color:#ffffffe6}
.h8-num{border-top:0;box-shadow:0 18px 40px #0f5a2e40}
.h8-num.zero{border-top:0;outline:3px solid #fecaca}
.h8-num-ic{display:block;width:52px;height:52px;margin:0 auto 8px;filter:drop-shadow(0 6px 8px #00000024)}
.h8-num.zero .h8-num-ic{filter:grayscale(1) opacity(.5)}
@media(max-width:760px){.h8-num-ic{width:34px;height:34px;margin-bottom:4px}}
.h8-turn{background:linear-gradient(165deg,#178a4a 0%,#15803d 50%,#166534 100%)}
/* 실제 계정 숫자 섹션: 눈 편한 연한 민트 */
.h8-turn{background:linear-gradient(180deg,#f3faf6 0%,#e8f5ed 100%);color:var(--h8-ink);border-block:1px solid #dcefe3}
.h8-turn .h8-tag{color:var(--h8-g2);background:#fff;border:1px solid #cfe9d9}
.h8-turn h2{color:var(--h8-ink)}
.h8-turn p{color:#4b5a52}
.h8-turn p b{color:var(--h8-ink)}
.h8-num{box-shadow:0 14px 34px #1f9d551f;border:1px solid #e1efe6}
/* 점검 툴 실제 화면 */
.h8-leak{margin-top:56px;background:#fff;border:1px solid #dcefe3;border-radius:24px;padding:30px 28px 24px;box-shadow:0 18px 44px #1f9d551a}
.h8-turn p.h8-leak-t{font-size:clamp(20px,2.6vw,26px);font-weight:900;letter-spacing:-.04em;color:var(--h8-ink);margin:0 0 18px}
.h8-leak-shot{display:block;border:1px solid var(--h8-line);border-radius:12px;overflow:hidden;cursor:zoom-in}
.h8-leak-shot img{width:100%;display:block}
.h8-turn p.h8-leak-c{margin-top:14px;font-size:15.5px;color:#4b5a52}
.h8-turn p.h8-leak-c b{color:var(--h8-ink)}
.h8-turn p.h8-leak-c b.red{color:var(--h8-red)}
@media(max-width:760px){.h8-leak{padding:22px 14px 18px;margin-top:40px}}
/* 성과 숫자: 원본 화면의 빨간 박스와 같은 빨강 */
.h8-metric b{color:var(--h8-red)}
.h8-metric em{background:#fef2f2;color:#b91c1c}
.h8-logos .dg{background:#ff6f0f}
.h8-logos .dg svg{width:20px;height:20px;fill:#fff}
.h8-logos .dg .lf{fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round}
/* 홈페이지 제작 예시 갤러리 */
.h8-demos{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:780px;margin:28px auto 0}
.h8-demo{position:relative;display:block;border-radius:14px;overflow:hidden;border:1px solid var(--h8-line);box-shadow:0 16px 36px #0000001f;transition:transform .25s}
.h8-demo:hover{transform:translateY(-3px)}
.h8-demo.big{grid-column:1/-1}
.h8-demo img{width:100%;display:block}
.h8-demo span{position:absolute;left:12px;bottom:12px;background:#111111d9;color:#fff;font-size:13px;font-weight:800;padding:6px 12px;border-radius:999px}
.h8-svc-item .h8-more+.h8-more{margin-left:18px}
@media(max-width:760px){.h8-demos{gap:10px}.h8-demo span{font-size:11.5px;left:8px;bottom:8px;padding:4px 9px}.h8-svc-item .h8-more+.h8-more{margin-left:0;display:flex;justify-content:center;margin-top:8px}}
/* 신청 섹션: 실제 사무실 사진 + 그라데이션 */
.h8-offer{background:linear-gradient(180deg,#0b1a12e0 0%,#0b1a12b8 45%,#0b1a12e6 100%),url(demo-picture-da7d6594d4.webp) center/cover no-repeat}
.h8-offer .h8-tag{color:#fff;background:#ffffff1f;border:1px solid #ffffff33;padding:6px 14px;border-radius:999px;letter-spacing:.04em}
.h8-offer h2 em{color:#86efac}
.h8-offer .h8-lead{color:#ffffffd9}
.h8-promise{background:#fff;border:0;box-shadow:0 24px 50px #00000040}
.h8-promise:before{background:var(--h8-g2);color:#fff}
.h8-promise i{color:var(--h8-g2)}
.h8-promise p{color:#374151}
.h8-promise p b{color:var(--h8-ink)}
.h8-offer .h8-btn{background:var(--h8-g2);color:#fff;box-shadow:0 16px 36px #1f9d5559}
.h8-offer .h8-btn:hover{box-shadow:0 20px 44px #1f9d5573}
/* 중간 폭: 오른쪽 버튼은 아이콘만 */
@media(min-width:761px) and (max-width:1280px){.h8-rail a{min-width:0;padding:9px}.h8-rail a>span:not(.ic){display:none}.h8-rail{right:14px}}
/* 모바일 터치·글자 크기 보정 */
.h8-more{min-height:44px}
.h8-bar button{min-width:40px;min-height:40px}
.h8-offer .mini a{display:inline-block;padding:10px 2px}
@media(max-width:760px){.h8-metric i{font-size:12px}.h8-metric em{font-size:12px;padding:3px 6px}.h8-metric s{font-size:12.5px}}
/* 줄바꿈: 제목은 균형 있게, 본문은 마지막 줄 한 글자 방지 */
.h8 h1,.h8 h2,.h8 h3,.h8-svc-item h3,.h8-out b{text-wrap:balance}
.h8 p,.h8 li{text-wrap:pretty}
@media(max-width:760px){p br.pc{display:none}}
.h8-offer .h8-lead b{color:#86efac}
/* 모바일 최종 보정 */
@media(max-width:760px){footer,footer p,footer span,footer summary,.footer,.footer span{font-size:12.5px!important}footer a,.footer a,.ft a,.ct-direct a,.biz a,.business-info a{display:inline-block;padding:10px 2px;min-height:40px}.skip:focus{padding:12px}.partner-console-bar,.partner-console-bar span,.capture-tag,.partner-tab-number,.partner-capture-caption{font-size:11px!important}.partner-output-link{min-height:44px}.analysis-player__toggle{min-height:44px}}
@media(max-width:760px){#settlement .fl-amount{font-size:48px}.h8 .red,.h8 b.red{white-space:nowrap}}
/* 짧은 문단은 줄 길이를 고르게(6줄 넘는 문단은 브라우저가 자동으로 예외 처리) */
p,li{text-wrap:balance}
/* 속도: 화면 아래 사진 배경은 가까워질 때만 받음(lazy-bg.js) */
.h8-offer:not(.bg-on),.ab-trust:not(.bg-on),.gc-dark:not(.bg-on),.apply:not(.bg-on){background-image:none!important;background-color:#0f2419!important}