:root{
  --canvas:#f3f4ef; --surface1:#ffffff; --tint:#f7f8f3;
  --hairline:#dcdfd4; --hairline-soft:#e6e9df;
  --ink:#141712; --ink-muted:#565b4f; --ink-subtle:#7d8274; --ink-tertiary:#9aa08e;
  --lime:#b6e61e; --lime-mark:#d9f596; --lime-deep:#8fbf12; --lime-ink:#3d5306;
  --r-md:10px; --r-lg:16px; --r-xl:22px; --r-pill:999px; --wrap:1120px;
  --sh-1:0 1px 2px rgba(20,23,18,.04);
  --sh-2:0 1px 2px rgba(20,23,18,.04), 0 10px 26px rgba(20,23,18,.055);
  --sh-3:0 2px 4px rgba(20,23,18,.05), 0 18px 44px rgba(20,23,18,.09);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
#how,#solutions,#evidence,#verticals,#contact{scroll-margin-top:80px}
body{margin:0;background:var(--canvas);color:var(--ink);
  font-family:"Pretendard","Inter","Apple SD Gothic Neo",system-ui,sans-serif;
  font-weight:400;line-height:1.6;-webkit-font-smoothing:antialiased;letter-spacing:-.1px;overflow-wrap:break-word;word-break:keep-all}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.mk{background:linear-gradient(transparent 58%,var(--lime-mark) 58%);padding:0 4px;border-radius:2px}

/* nav */
.nav{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.82);backdrop-filter:blur(14px) saturate(1.2);border-bottom:1px solid var(--hairline-soft)}
.nav .wrap{display:flex;align-items:center;gap:20px;height:64px}
.logo{font-weight:900;font-size:22px;letter-spacing:-.5px}
.navlinks{display:flex;gap:22px;margin:0 auto}
.navlinks a{color:var(--ink-muted);font-size:15px;font-weight:500;transition:color .12s}
.navlinks a:hover{color:var(--ink)}
.ncall{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:700}
.ncall i{color:var(--lime-deep)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(180deg,#20261c,#141712);color:#fff;border:1px solid #141712;
  border-radius:var(--r-pill);padding:13px 26px;font-size:16px;font-weight:700;cursor:pointer;letter-spacing:-.2px;
  box-shadow:var(--sh-1);transition:transform .14s,box-shadow .14s,filter .14s}
.btn:hover{transform:translateY(-2px);box-shadow:var(--sh-2);filter:brightness(1.08)}
.btn.sm{padding:9px 18px;font-size:14px}
.btn.lg{padding:17px 34px;font-size:18px}
.btn.ghost{background:rgba(255,255,255,.6);color:var(--ink);border:1.5px solid var(--ink);box-shadow:none}
.btn.ghost:hover{background:#fff;filter:none}
.btn.lime{background:linear-gradient(180deg,#c6f230,#b0df18);color:var(--ink);border-color:#a6d417;box-shadow:0 6px 18px rgba(143,191,18,.28)}
.btn.lime:hover{box-shadow:0 10px 26px rgba(143,191,18,.36)}
.btn.block{width:100%;justify-content:center;margin-top:14px}

/* hero — 부드러운 상단 광원 */
.hero{position:relative;padding:96px 0 74px;text-align:center;overflow:hidden;
  background:linear-gradient(180deg,#ffffff 0%,#fafbf7 42%,var(--canvas) 100%)}
.hero::before{content:"";position:absolute;top:-320px;left:50%;transform:translateX(-50%);width:1100px;height:620px;
  background:radial-gradient(closest-side,rgba(182,230,30,.28),rgba(182,230,30,0) 72%);pointer-events:none}
.hero .wrap{position:relative;z-index:1}
.hero .ey{display:inline-block;background:linear-gradient(180deg,#e2f7a8,var(--lime-mark));color:var(--lime-ink);font-weight:800;font-size:14.5px;padding:6px 18px;border-radius:var(--r-pill);margin-bottom:26px;box-shadow:var(--sh-1)}
.hero h1{font-size:68px;line-height:1.15;margin:0;font-weight:900;letter-spacing:-2.4px}
.hero .sub{color:var(--ink-muted);font-size:20px;margin:26px auto 24px;max-width:680px;letter-spacing:-.3px}
.chips{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:30px}
.chip{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(180deg,#fff,#fbfcf8);border:1px solid var(--hairline);border-radius:var(--r-pill);padding:9px 16px;font-size:14.5px;font-weight:700;box-shadow:var(--sh-1)}
.chip i{color:var(--lime-deep);font-size:17px}
.hero .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.assure{margin-top:22px;color:var(--ink-subtle);font-size:15px}
.assure a{font-weight:700;color:var(--ink);border-bottom:2px solid var(--lime)}

/* 섹션 밴드 — 흰/회색 교차 + 은은한 그라데이션 */
.sec{position:relative;padding:76px 0}
.sec.white{background:linear-gradient(180deg,#ffffff 0%,#ffffff 55%,#fbfcf8 100%);
  border-top:1px solid var(--hairline-soft);border-bottom:1px solid var(--hairline-soft)}
.sec.gray{background:linear-gradient(180deg,#f0f2eb 0%,var(--canvas) 40%,#eef0e8 100%)}
.sec.gray::before{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent)}
.sec h2{font-size:42px;font-weight:900;letter-spacing:-1.6px;text-align:center;margin:0 0 14px;line-height:1.15}
.ssub{text-align:center;color:var(--ink-subtle);font-size:17px;margin:0 0 40px}
#how h2,#verticals h2{margin-bottom:40px}

/* 일하는 방식 (흰 밴드 → 카드는 톤 다운) */
.flows{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fl{background:linear-gradient(180deg,var(--tint),#f1f3ec);border:1px solid var(--hairline-soft);border-radius:var(--r-xl);padding:34px 28px;text-align:center;transition:transform .14s,box-shadow .14s}
.fl:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.fl .n{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#20261c,#141712);color:var(--lime);font-weight:900;font-size:14px;border-radius:var(--r-pill);padding:5px 14px;margin-bottom:14px;box-shadow:var(--sh-1)}
.fl b{display:block;font-size:21px;font-weight:800;letter-spacing:-.5px;margin-bottom:8px}
.fl p{color:var(--ink-muted);font-size:15px;margin:0}

/* 솔루션 (회색 밴드 → 흰 카드) */
.soltag{display:inline-block;background:linear-gradient(180deg,#20261c,#141712);color:var(--lime);font-size:13.5px;font-weight:800;padding:5px 14px;border-radius:var(--r-pill);margin:0 0 16px;box-shadow:var(--sh-1)}
.sols{display:grid;gap:16px;margin-bottom:40px}
.sols.main{grid-template-columns:repeat(2,1fr)}
.sols.own{grid-template-columns:repeat(4,1fr);margin-bottom:0}
.sol{background:linear-gradient(180deg,#ffffff,#fdfefb);border:1px solid var(--hairline);border-radius:var(--r-xl);padding:30px 26px;display:flex;flex-direction:column;gap:9px;box-shadow:var(--sh-1);transition:transform .14s,box-shadow .14s,border-color .14s}
.sol:hover{transform:translateY(-4px);box-shadow:var(--sh-3);border-color:var(--ink-tertiary)}
.sol.big{border:1.5px solid var(--ink);padding:38px 34px;background:linear-gradient(155deg,#ffffff 55%,#fcfee9)}
.sol .ic{width:54px;height:54px;border-radius:var(--r-lg);background:linear-gradient(160deg,#e6f9b4,var(--lime-mark));display:flex;align-items:center;justify-content:center;font-size:27px;color:var(--lime-ink);margin-bottom:4px;box-shadow:var(--sh-1)}
.sol .ic.sm{width:44px;height:44px;font-size:22px;border-radius:12px}
.sol .sh{display:flex;flex-direction:column;gap:2px}
.sol h3{font-size:21px;margin:0;font-weight:800;letter-spacing:-.5px;line-height:1.3}
.sol.big h3{font-size:25px}
.sol .ss{color:var(--ink-subtle);font-size:13.5px;font-weight:700}
.sol p{color:var(--ink-muted);font-size:15px;margin:4px 0 0;flex:1}
.sol.big p{font-size:16px}
.sol .snote{color:var(--ink);font-size:13.5px;font-weight:700;background:linear-gradient(180deg,var(--tint),#eef1e8);border-radius:var(--r-md);padding:10px 13px;flex:0}
.stag{align-self:flex-start;background:linear-gradient(180deg,#fff,var(--tint));border:1px solid var(--hairline);color:var(--ink-subtle);font-size:12px;font-weight:700;padding:4px 11px;border-radius:var(--r-pill)}
.sol .fit{color:var(--lime-ink);font-size:13.5px;font-weight:700;display:flex;gap:6px;align-items:flex-start;border-top:1px solid var(--hairline-soft);padding-top:12px;margin-top:4px}
.sol .fit i{margin-top:2px}

/* 증거 (흰 밴드 → 카드는 톤 다운) */
.evs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ev{background:linear-gradient(180deg,var(--tint),#f1f3ec);border:1px solid var(--hairline-soft);border-radius:var(--r-xl);padding:32px 28px;transition:transform .14s,box-shadow .14s}
.ev:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.eh{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.eh i{font-size:24px;color:var(--lime-deep)}
.eh b{font-size:20px;font-weight:800;letter-spacing:-.4px}
.elead{color:var(--ink);font-size:14.5px;font-weight:600;margin:0 0 14px}
.ev ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.ev li{color:var(--ink-muted);font-size:14px;padding-left:15px;position:relative;line-height:1.5}
.ev li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;border-radius:50%;background:var(--lime-deep)}
.certs{text-align:center;color:var(--ink-subtle);font-size:14px;margin:32px 0 0}
.note{text-align:center;color:var(--ink-subtle);font-size:14.5px;margin:14px 0 0;display:flex;gap:7px;justify-content:center;align-items:center}
.note i{color:var(--lime-deep);font-size:18px}

/* 운영 중인 시스템 (회색 밴드 → 흰 카드) */
.syss{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.sy{background:linear-gradient(180deg,#ffffff,#fdfefb);border:1px solid var(--hairline);border-radius:var(--r-xl);padding:28px 26px;display:flex;flex-direction:column;gap:9px;box-shadow:var(--sh-1);transition:transform .14s,box-shadow .14s,border-color .14s}
a.sy:hover{transform:translateY(-4px);box-shadow:var(--sh-3);border-color:var(--ink)}
.sy-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:2px}
.sy-ic{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:23px;
  background:linear-gradient(160deg,#e9fabc,var(--lime-mark));color:var(--lime-ink)}
.sy-st{font-size:11.5px;font-weight:800;color:var(--lime-ink);background:var(--lime-mark);border-radius:var(--r-pill);padding:4px 11px;white-space:nowrap}
.sy-st.soon{color:var(--ink-subtle);background:var(--tint);border:1px solid var(--hairline)}
.sy h3{font-size:19px;margin:0;font-weight:800;letter-spacing:-.4px;line-height:1.3}
.sy p{color:var(--ink-muted);font-size:14.5px;margin:0;flex:1}
.sy-go{color:var(--lime-ink);font-weight:800;font-size:14px;display:inline-flex;align-items:center;gap:5px;
  border-top:1px solid var(--hairline-soft);padding-top:12px;margin-top:2px}

/* 상담 — 딥 그라데이션 + 라임 광원 */
.cta{padding:0 24px;margin:0;background:linear-gradient(180deg,var(--canvas) 0%,#eceee6 100%);padding-top:64px;padding-bottom:84px}
.cta .wrap{position:relative;background:linear-gradient(155deg,#232a1e 0%,#161a12 45%,#0e110a 100%);border-radius:28px;padding:64px 48px;text-align:center;max-width:880px;overflow:hidden;
  box-shadow:0 30px 70px rgba(20,23,18,.3)}
.cta .wrap::before{content:"";position:absolute;top:-180px;right:-120px;width:520px;height:520px;
  background:radial-gradient(closest-side,rgba(182,230,30,.22),rgba(182,230,30,0) 70%);pointer-events:none}
.cta h3,.cta>.wrap>p,.quick,form#lead{position:relative;z-index:1}
.cta h3{color:#fff;font-size:36px;margin:0;font-weight:900;letter-spacing:-1.3px}
.cta>.wrap>p{color:rgba(255,255,255,.76);font-size:17px;margin:14px 0 22px}
.quick{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}
.quick .btn.ghost{background:rgba(255,255,255,.06);color:#fff;border-color:rgba(255,255,255,.35)}
.quick .btn.ghost:hover{background:rgba(255,255,255,.13);border-color:#fff}
form#lead{max-width:560px;margin:0 auto;text-align:left}
.cta .grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.cta input,.cta select{width:100%;height:50px;border:1px solid rgba(255,255,255,.22);border-radius:var(--r-md);background:rgba(255,255,255,.07);padding:0 15px;font-size:15px;font-family:inherit;color:#fff}
.cta input::placeholder{color:rgba(255,255,255,.48)}
.cta select option{color:var(--ink)}
.cta input:focus,.cta select:focus{outline:none;border-color:var(--lime);background:rgba(255,255,255,.11)}
.cta-sub{color:rgba(255,255,255,.52);font-size:14px;text-align:center;margin-top:12px}
.msg{margin-top:12px;font-size:15px;font-weight:600;text-align:center}
.msg.ok{color:var(--lime)}.msg.err{color:#ff9d8a}

/* footer */
.foot{border-top:1px solid var(--hairline-soft);padding:34px 0;background:linear-gradient(180deg,#eceee6,var(--canvas))}
.foot .wrap{display:flex;gap:14px;align-items:center;justify-content:center;color:var(--ink-subtle);font-size:14px;flex-wrap:wrap}
.flogo{font-weight:900;color:var(--ink);font-size:15px}
.fsep{color:var(--ink-tertiary)}

@media(max-width:980px){ .sols.own{grid-template-columns:repeat(2,1fr)} }
@media(max-width:900px){
  .hero{padding:62px 0 48px}
  .hero h1{font-size:40px;letter-spacing:-1.4px}
  .hero .sub{font-size:18px}
  .hero .sub .bd{display:none}
  .sec{padding:54px 0}
  .sec h2{font-size:31px}
  .flows,.sols.main,.sols.own,.evs,.syss{grid-template-columns:1fr}
  .cta{padding-top:44px;padding-bottom:56px}
  .cta .wrap{padding:40px 24px}.cta h3{font-size:27px}.cta .grid2{grid-template-columns:1fr}
  .navlinks,.ncall{display:none}
}