/* 우리가게 10만원 랜딩 챌린지 — 모바일 우선 */
:root{--ink:#0C1526;--ink2:#2B3444;--g1:#5A6474;--g2:#8A93A3;--line:#E6E9F0;--blue:#1557F3;--blue2:#0E42C8;
  --coral:#FF5A36;--cream:#FFF6EE;--sky:#EEF4FF;--sans:"Pretendard Variable",Pretendard,-apple-system,system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:#fff;line-height:1.65;word-break:keep-all;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--blue);color:#fff}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:6px}
.w{width:100%;max-width:1120px;margin:0 auto;padding:0 20px}
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.85,.25,1)}
.rv.in{opacity:1;transform:none}.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}

/* 머리말 */
.hd{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hd .w{display:flex;align-items:center;justify-content:space-between;height:60px;gap:12px}
.lg{font-weight:800;font-size:18px;letter-spacing:-.04em;display:inline-flex;align-items:baseline;gap:6px;white-space:nowrap}
.lg u{display:inline-block;width:5px;height:5px;background:var(--blue);text-decoration:none}
.lg span{font-size:11.5px;font-weight:700;color:var(--g2);letter-spacing:.02em}
.hd .r{display:flex;align-items:center;gap:8px}
.tel{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 13px;border:1px solid var(--line);border-radius:999px;font-size:13.5px;font-weight:700}
.tel svg{width:14px;height:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:38px;padding:0 16px;border:0;border-radius:999px;background:var(--ink);color:#fff;font-size:13.5px;font-weight:700;white-space:nowrap;transition:background .25s,transform .25s}
.btn:hover{background:var(--blue)}.btn:active{transform:scale(.97)}
.btn.bl{background:var(--blue)}.btn.bl:hover{background:var(--blue2)}
.btn.lg2{height:58px;padding:0 28px;font-size:16.5px;border-radius:999px}
.btn.gh{background:#fff;color:var(--ink);border:1.5px solid var(--ink)}.btn.gh:hover{background:var(--ink);color:#fff}

/* 히어로 */
.hero{position:relative;padding:34px 0 0;background:linear-gradient(180deg,var(--sky),#fff 62%);overflow:hidden}
.bdg{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 13px;border-radius:999px;background:#fff;border:1px solid #CFE0FF;color:var(--blue);font-size:12.5px;font-weight:800;letter-spacing:-.01em}
.bdg i{width:6px;height:6px;border-radius:50%;background:var(--coral);animation:bl 1.4s steps(1) infinite}
@keyframes bl{50%{opacity:.25}}
.hero h1{margin-top:16px;font-size:clamp(30px,8.4vw,60px);font-weight:800;letter-spacing:-.045em;line-height:1.24}
.hero h1 b{color:var(--blue)}
.hero .sub{margin-top:14px;font-size:clamp(15px,4vw,19px);color:var(--ink2);line-height:1.75;max-width:30em}
.pricebox{margin-top:22px;display:inline-flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.pricebox .n{font-size:clamp(44px,13vw,76px);font-weight:800;letter-spacing:-.05em;line-height:1;color:var(--coral)}
.pricebox .n small{font-size:.34em;font-weight:800;margin-left:2px}
.pricebox .was{font-size:14px;color:var(--g2);padding-bottom:8px}
.pricebox .was s{opacity:.8}
.hcta{margin-top:22px;display:flex;gap:10px;flex-wrap:wrap}
.note{margin-top:14px;font-size:13px;color:var(--g1);line-height:1.7}
.heroimg{margin:28px auto 0;max-width:330px;padding-bottom:40px}
@media(min-width:861px){.hero{padding-top:56px}.hero .w{display:grid;grid-template-columns:1.08fr .92fr;gap:40px;align-items:center}
  .heroimg{margin:0;max-width:360px;padding-bottom:0;justify-self:end}}

/* 폰 목업 */
.ph{position:relative;border-radius:34px;background:#0C1526;padding:9px;box-shadow:0 26px 60px rgba(12,25,60,.28)}
.ph .scr{border-radius:26px;overflow:hidden;background:#fff}
.ph .bar{height:22px;background:#0C1526;display:flex;align-items:center;justify-content:center}
.ph .bar i{width:52px;height:5px;border-radius:99px;background:#33405A}
.mk{font-size:11px;line-height:1.5}
.mk .top{padding:12px 13px;background:linear-gradient(140deg,#1557F3,#0E42C8);color:#fff}
.mk .top b{display:block;font-size:15px;font-weight:800;letter-spacing:-.03em}
.mk .top span{opacity:.86;font-size:10.5px}
.mk .cta{display:flex;gap:6px;padding:10px 13px;background:#fff;border-bottom:1px solid var(--line)}
.mk .cta a{flex:1;text-align:center;padding:9px 0;border-radius:8px;font-weight:800;font-size:11px}
.mk .cta .a{background:var(--coral);color:#fff}.mk .cta .b{background:#EEF2F8;color:var(--ink)}
.mk .row{display:flex;gap:8px;padding:10px 13px;border-bottom:1px solid var(--line)}
.mk .row .k{width:46px;color:var(--g2);flex:0 0 auto;font-weight:700}
.mk .row .v{font-weight:600;color:var(--ink2)}
.mk .ph2{height:74px;background:linear-gradient(120deg,#DCE6F7,#EEF2F8)}
.mk .f{padding:11px 13px 14px;background:#F7F9FC}
.mk .f b{display:block;font-size:11.5px;font-weight:800;margin-bottom:7px}
.mk .f i{display:block;height:22px;border-radius:6px;background:#fff;border:1px solid var(--line);margin-bottom:5px}
.mk .f .s{height:26px;border-radius:6px;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:10.5px;font-weight:800}
.tag{position:absolute;display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:999px;background:#fff;box-shadow:0 6px 18px rgba(12,25,60,.16);font-size:11px;font-weight:800;white-space:nowrap}
.tag b{display:grid;place-items:center;width:15px;height:15px;border-radius:50%;background:var(--blue);color:#fff;font-size:9px}
.t1{left:-14px;top:74px}.t2{right:-16px;top:150px}.t3{left:-18px;bottom:96px}
@media(max-width:400px){.t1,.t2,.t3{display:none}}

/* 공통 섹션 */
.sec{padding:60px 0}
.sec.cream{background:var(--cream)}.sec.sky{background:var(--sky)}.sec.ink{background:var(--ink);color:#fff}
.kk{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:800;letter-spacing:.02em;color:var(--blue)}
.kk i{width:7px;height:7px;background:var(--blue)}
.sec.ink .kk{color:#8FB4FF}.sec.ink .kk i{background:#8FB4FF}
.h2{margin-top:12px;font-size:clamp(23px,6.2vw,38px);font-weight:800;letter-spacing:-.04em;line-height:1.35}
.h2 b{color:var(--blue)}.sec.ink .h2 b{color:#8FB4FF}
.lead{margin-top:14px;font-size:clamp(14.5px,3.8vw,17px);color:var(--g1);line-height:1.8;max-width:40em}
.sec.ink .lead{color:rgba(255,255,255,.78)}
@media(min-width:861px){.sec{padding:96px 0}}

/* 왜 10만원 */
.why{margin-top:26px;display:grid;gap:12px}
.why div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px}
.why em{font-style:normal;font-size:12px;font-weight:800;color:var(--blue)}
.why h3{margin-top:8px;font-size:17px;font-weight:800;letter-spacing:-.03em}
.why p{margin-top:7px;font-size:14.5px;color:var(--g1);line-height:1.75}
@media(min-width:861px){.why{grid-template-columns:repeat(3,1fr);gap:16px}.why div{padding:26px}}

/* 무엇을 만드나 */
.mkw{margin-top:30px;display:grid;gap:28px;align-items:center}
.mklist{display:grid;gap:10px}
.mki{display:grid;grid-template-columns:28px 1fr;gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:15px}
.mki b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--blue);color:#fff;font-size:12.5px;font-weight:800}
.mki h4{font-size:15.5px;font-weight:800;letter-spacing:-.03em}
.mki p{margin-top:4px;font-size:13.5px;color:var(--g1);line-height:1.7}
@media(min-width:861px){.mkw{grid-template-columns:.86fr 1.14fr;gap:52px}.mklist{gap:12px}}

/* 검색 : 하는 일 / 안 하는 말 */
.two{margin-top:26px;display:grid;gap:14px}
.card{border-radius:16px;padding:22px}
.card.do{background:#fff;border:1px solid var(--line)}
.card.dont{background:#F6F8FB;border:1px solid var(--line)}
.card h3{font-size:17px;font-weight:800;letter-spacing:-.03em;display:flex;align-items:center;gap:8px}
.card h3 span{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;font-size:12px;color:#fff}
.card.do h3 span{background:var(--blue)}.card.dont h3 span{background:var(--g2)}
.card ul{margin-top:14px;list-style:none;display:grid;gap:10px}
.card li{font-size:14.5px;line-height:1.7;color:var(--ink2);padding-left:18px;position:relative}
.card li:before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:var(--blue)}
.card.dont li{color:var(--g1)}.card.dont li:before{background:var(--g2)}
.card li b{color:var(--ink)}
@media(min-width:861px){.two{grid-template-columns:1fr 1fr;gap:18px}.card{padding:30px}}

/* 진행 */
.steps{margin-top:30px;display:grid;gap:12px;counter-reset:s}
.stp{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 20px 20px 56px}
.stp:before{counter-increment:s;content:counter(s);position:absolute;left:18px;top:19px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font-size:12.5px;font-weight:800}
.stp h4{font-size:16px;font-weight:800;letter-spacing:-.03em}
.stp p{margin-top:6px;font-size:14px;color:var(--g1);line-height:1.7}
.stp .tm{display:inline-block;margin-top:9px;font-size:12px;font-weight:800;color:var(--blue);background:var(--sky);border-radius:999px;padding:4px 10px}
@media(min-width:861px){.steps{grid-template-columns:repeat(4,1fr);gap:14px}}

/* 포함/불포함 */
.inc{margin-top:26px;display:grid;gap:12px}
.inc>div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px}
.inc h3{font-size:16.5px;font-weight:800;letter-spacing:-.03em;margin-bottom:14px}
.inc ul{list-style:none;display:grid;gap:9px}
.inc li{font-size:14.5px;line-height:1.65;display:grid;grid-template-columns:18px 1fr;gap:9px;color:var(--ink2)}
.inc li i{font-style:normal;font-weight:900;font-size:13px}
.inc .y li i{color:var(--blue)}.inc .n li i{color:var(--g2)}.inc .n li{color:var(--g1)}
.inc small{display:block;margin-top:2px;font-size:12.5px;color:var(--g2)}
@media(min-width:861px){.inc{grid-template-columns:1fr 1fr;gap:16px}.inc>div{padding:28px}}

/* 맞다/아니다 */
.fit{margin-top:26px;display:grid;gap:10px}
.fit div{display:grid;grid-template-columns:22px 1fr;gap:11px;align-items:start;background:rgba(255,255,255,.06);border-radius:12px;padding:15px}
.fit div i{font-style:normal;font-weight:900;font-size:13px;color:#8FB4FF;line-height:1.6}
.fit div.no{background:rgba(255,255,255,.03)}.fit div.no i{color:rgba(255,255,255,.4)}
.fit p{font-size:14.5px;line-height:1.7}
.fit div.no p{color:rgba(255,255,255,.6)}
@media(min-width:861px){.fit{grid-template-columns:1fr 1fr;gap:12px}}

/* FAQ */
.faq{margin-top:26px;border-top:1.5px solid var(--ink)}
.faq .it{border-bottom:1px solid var(--line)}
.faq button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:14px;background:none;border:0;text-align:left;padding:19px 0;font-size:15.5px;font-weight:800;letter-spacing:-.03em;transition:color .25s}
.faq button:hover,.faq .it.on button{color:var(--blue)}
.faq button i{position:relative;flex:0 0 auto;width:14px;height:14px}
.faq button i:before,.faq button i:after{content:"";position:absolute;left:0;top:6px;width:14px;height:2px;background:currentColor;transition:transform .35s}
.faq button i:after{transform:rotate(90deg)}.faq .it.on button i:after{transform:none}
.faq .bd{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease}
.faq .it.on .bd{grid-template-rows:1fr}.faq .bd>div{overflow:hidden}
.faq .bd p{padding:0 0 19px;font-size:14.5px;line-height:1.8;color:var(--g1)}

/* 신청 */
.form{margin-top:26px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px}
.fg{display:grid;gap:14px}
.fl{display:block;font-size:13px;font-weight:800;margin-bottom:7px}
.fl em{font-style:normal;color:var(--coral);margin-left:3px}
.fi{width:100%;height:50px;border:1.5px solid var(--line);border-radius:10px;padding:0 14px;font-size:15.5px;background:#fff;outline:0;transition:border-color .2s}
textarea.fi{height:110px;padding:13px 14px;line-height:1.65;resize:vertical}
select.fi{appearance:none;-webkit-appearance:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='8'%3E%3Cpath d='M1 1l5.5 5.5L12 1' fill='none' stroke='%238A93A3' stroke-width='1.8'/%3E%3C/svg%3E") no-repeat right 14px center}
.fi:focus{border-color:var(--blue)}
.fi::placeholder{color:#A9B2C0}
.agree{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--g1);line-height:1.6;margin-top:4px}
.agree input{width:18px;height:18px;margin-top:2px;accent-color:var(--blue);flex:0 0 auto}
.agree a{text-decoration:underline}
.sbtn{width:100%;height:58px;border:0;border-radius:999px;background:var(--blue);color:#fff;font-size:16.5px;font-weight:800;margin-top:6px;transition:background .25s,transform .2s}
.sbtn:hover{background:var(--blue2)}.sbtn:active{transform:scale(.99)}.sbtn[disabled]{opacity:.55;pointer-events:none}
.msg{margin-top:12px;font-size:14px;font-weight:700;min-height:1.5em;text-align:center}
.msg.err{color:#D9364A}
.done{display:none;text-align:center;padding:30px 10px}
.done h3{font-size:22px;font-weight:800;letter-spacing:-.04em;line-height:1.4}
.done p{margin-top:12px;font-size:15px;color:var(--g1);line-height:1.8}
.done b{color:var(--blue)}
@media(min-width:861px){.form{padding:32px}.fg.two2{grid-template-columns:1fr 1fr;display:grid;gap:14px}}

/* 고정 바 (모바일) */
.fixbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;gap:8px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);transform:translateY(120%);transition:transform .4s cubic-bezier(.2,.9,.3,1)}
.fixbar.on{transform:none}
.fixbar .tel{flex:0 0 auto;height:48px}
.fixbar .btn{flex:1;height:48px;font-size:15px}
@media(min-width:861px){.fixbar{display:none}}
body{padding-bottom:0}

/* 푸터 */
.ft{background:var(--ink);color:rgba(255,255,255,.62);padding:40px 0 100px;font-size:13px;line-height:1.85}
.ft b{color:#fff;font-weight:700}
.ft .t{font-size:17px;font-weight:800;color:#fff;letter-spacing:-.03em;margin-bottom:14px}
.ft .ln{display:flex;gap:16px;flex-wrap:wrap;margin:16px 0 20px}
.ft .ln a{color:#fff;font-weight:600;border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:2px}
.ft .cp{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14);font-size:12px;color:rgba(255,255,255,.45)}
@media(min-width:861px){.ft{padding:56px 0 46px}}

/* ================= 실제 사례 ================= */
.case{background:linear-gradient(160deg,#0A1020,#12224A)}
.case .kk{color:#8FB4FF}.case .kk i{background:#8FB4FF}
.case .h2{color:#fff}.case .h2 b{color:#8FB4FF}
.case .lead{color:rgba(255,255,255,.72)}
.cnum{margin-top:28px;display:grid;gap:12px}
.cnum>div{position:relative;border-radius:16px;padding:24px 22px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);overflow:hidden}
.cnum>div:after{content:"";position:absolute;right:-30px;bottom:-40px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(21,87,243,.5),rgba(21,87,243,0) 70%)}
.cnum em{position:relative;font-style:normal;display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px;border-radius:999px;background:rgba(255,255,255,.1);font-size:11.5px;font-weight:800;color:#BFD4FF}
.cnum b{position:relative;display:block;margin-top:14px;font-size:clamp(46px,14vw,72px);font-weight:800;letter-spacing:-.05em;line-height:1;color:#fff}
.cnum b small{font-size:.32em;font-weight:800;margin-left:4px}
.cnum p{position:relative;margin-top:10px;font-size:15px;font-weight:700;color:#fff}
.cnum span{position:relative;display:block;margin-top:5px;font-size:13px;color:rgba(255,255,255,.6);line-height:1.6}
.cnote{margin-top:18px;font-size:12.5px;line-height:1.75;color:rgba(255,255,255,.62)}
@media(min-width:861px){.cnum{grid-template-columns:1fr 1fr;gap:16px}.cnum>div{padding:30px 28px}}

/* 사장님 가이드 링크 (랜딩) — glinks 는 이 구역에서만 쓴다 */
.glinks{display:grid;gap:10px;margin-top:26px}
.glinks a{display:block;padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:#fff;transition:border-color .2s}
.glinks a b{display:block;font-size:16.5px}.glinks a span{display:block;font-size:14px;color:var(--g1);margin-top:4px;line-height:1.55}
.glinks a:hover{border-color:var(--blue)}.glinks a.all{background:var(--sky);border-color:transparent}
@media(min-width:861px){.glinks{grid-template-columns:1fr 1fr 1fr}}
