/* W BRIDGE GLOBAL — main.css */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:#FFFFFF;color:#111111;font-family:"Pretendard",-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-x:hidden}
body.lang-en{word-break:normal}
body.lang-zh{word-break:normal;font-family:"Pretendard","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif}
img{max-width:100%}
a{color:#111111;text-decoration:none}a:hover{color:#3A3A40}
button{font-family:inherit}
h1,h2,h3,h4{font-weight:inherit}
.en{font-family:"Outfit","Pretendard",sans-serif}
.num{font-variant-numeric:tabular-nums}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:#111;color:#fff;padding:10px 16px}
.skip:focus{left:12px;top:12px}
:focus-visible{outline:2px solid var(--ac);outline-offset:3px}
@media (max-width:860px){.hide-sm{display:none!important}}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* ===== header ===== */
.site-hdr{position:fixed;top:0;left:0;right:0;z-index:30;transition:background .35s,border-color .35s;background:transparent;border-bottom:1px solid rgba(255,255,255,.14)}
.site-hdr.solid{background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom-color:#ECECF1}
.admin-bar .site-hdr{top:32px}
@media (max-width:782px){.admin-bar .site-hdr{top:46px}}
.hdr-logo{height:30px;width:auto;display:block}
.site-hdr .logo-b{display:none}
.site-hdr.solid .logo-b{display:block}
.site-hdr.solid .logo-w{display:none}
.hdr-nav{display:flex;gap:34px;font-size:15px;font-weight:500;white-space:nowrap}
.hdr-nav a{color:#FFFFFF;transition:color .35s,opacity .2s}
.hdr-nav a:hover{opacity:.7}
.solid .hdr-nav a{color:#111111}
.hdr-cta{display:inline-flex;align-items:center;height:44px;padding:0 22px;border-radius:999px;font-size:14px;font-weight:600;white-space:nowrap;transition:background .35s,color .35s;background:#FFFFFF;color:#111111}
.hdr-cta:hover{color:#111111;opacity:.9}
.solid .hdr-cta{background:#111111;color:#FFFFFF}
.solid .hdr-cta:hover{color:#FFFFFF}

/* language switch */
.lang{display:flex;align-items:center;gap:2px;padding:3px;border-radius:999px;border:1px solid rgba(255,255,255,.3)}
.solid .lang{border-color:#E4E4EB}
.lang a{display:inline-flex;align-items:center;justify-content:center;font-family:"Outfit","Pretendard",sans-serif;font-size:13px;font-weight:500;letter-spacing:.02em;height:30px;min-width:38px;padding:0 10px;border-radius:999px;transition:background .25s,color .25s;color:rgba(255,255,255,.8)}
.lang a[aria-current]{background:#FFFFFF;color:#111111;font-weight:600}
.solid .lang a{color:#55555E}
.solid .lang a[aria-current]{background:#111111;color:#FFFFFF}

/* ===== hero ===== */
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.4s cubic-bezier(.25,.1,.25,1)}
.slide.is-active{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.04)}
.slide.is-active img{animation:kb 7s cubic-bezier(.25,.1,.25,1) forwards}
.slide-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity .8s}
.slide-video.ready{opacity:1}
@media (max-width:760px){.slide-video{display:none}}
@keyframes kb{from{transform:scale(1.16) translate3d(0,0,0)}to{transform:scale(1.04) translate3d(-1.2%,-1%,0)}}
.rise{animation:rise 1.1s cubic-bezier(.2,.7,.2,1) both}
.rise.r2{animation-delay:.15s}.rise.r3{animation-delay:.3s}.rise.r4{animation-delay:.45s}
@keyframes rise{from{opacity:0;transform:translateY(46px)}to{opacity:1;transform:none}}
.cap{animation:cap .9s cubic-bezier(.2,.7,.2,1) both}
.caps .cap{display:none}
.caps .cap.is-active{display:block}
@keyframes cap{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.ind .ind-no{opacity:.55;transition:opacity .3s}
.ind.is-active .ind-no{opacity:1}
.ind .fill{display:block;height:100%;width:0;background:#FFFFFF}
.ind.is-active .fill{animation:fillbar var(--dur,5.5s) linear forwards}
.hero.paused .ind.is-active .fill{animation-play-state:paused}
@keyframes fillbar{to{width:100%}}
.hero-pause .i-play{display:none}
.hero.paused .hero-pause .i-play{display:block}
.hero.paused .hero-pause .i-pause{display:none}
.dl-btn svg{transition:transform .3s}
.dl-btn:hover{color:#FFFFFF;opacity:.94}
.dl-btn:hover svg{transform:translateY(3px)}

/* ===== reveal (스크롤 시 나타남) ===== */
.reveal{transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.js .reveal{opacity:0;transform:translateY(44px)}
.js .on .reveal,.js .reveal.on{opacity:1;transform:none}

/* about words */
.about-words .aw{display:inline-block;margin-right:.22em}
.js .about-words .aw{opacity:.08;transform:translateY(40px);filter:blur(8px);will-change:opacity,transform,filter}
.about-words .aw.han{color:var(--ac);font-family:"Pretendard","Noto Sans SC",sans-serif;font-weight:500}
.js .about-txt{opacity:0;transform:translateY(30px)}

/* graph bars */
.graph .bar{width:var(--w);transition:width 1.5s cubic-bezier(.2,.7,.2,1)}
.js .graph .bar{width:0}
.graph .b-a{transition-delay:.15s}
.graph .b-b{transition-duration:1.3s;transition-delay:.9s}
.graph .b-c{transition-duration:1.1s;transition-delay:1.7s;transition-property:width,opacity}
.js .graph .b-c{opacity:0}
.js .graph.on .bar{width:var(--w)}
.js .graph.on .b-c{opacity:1}

/* compare */
.compare .chip{transition:opacity .9s .5s ease,transform .9s .5s ease}
.compare.on .chip{opacity:.55}
.compare.on .chip.even{transform:translateY(-4px) scale(.97)}
.compare.on .chip.odd{transform:translateY(4px) scale(.97)}
.compare .cmpbar{width:100%;transition:width 1.5s 1.1s cubic-bezier(.2,.7,.2,1)}
.js .compare .cmpbar{width:0}
.js .compare.on .cmpbar{width:100%}
.compare .cmptxt{transition:opacity .7s 2s}
.js .compare .cmptxt{opacity:0}
.js .compare.on .cmptxt{opacity:1}

/* service glint */
.svc{position:relative;overflow:hidden}
.svc::after{content:"";position:absolute;inset:-2px;pointer-events:none;transform:translateX(-130%);background:linear-gradient(110deg,rgba(255,255,255,0) 28%,rgba(255,255,255,.26) 47%,rgba(255,255,255,.06) 54%,rgba(255,255,255,0) 70%)}
.on .svcwrap .svc{animation:flash 7s ease infinite}
.on .svcwrap .svc::after{animation:sweep 7s cubic-bezier(.3,.1,.3,1) infinite}
.on .svcwrap .d1,.on .svcwrap .d1::after{animation-delay:.5s}
.on .svcwrap .d2,.on .svcwrap .d2::after{animation-delay:1s}
.on .svcwrap .d3,.on .svcwrap .d3::after{animation-delay:1.5s}
@keyframes sweep{0%{transform:translateX(-130%)}15%{transform:translateX(130%)}100%{transform:translateX(130%)}}
@keyframes flash{0%,100%{border-color:#2A2A35;box-shadow:0 0 0 rgba(0,0,0,0)}6%{border-color:rgba(255,255,255,.6);box-shadow:0 0 0 1px rgba(255,255,255,.12),0 24px 70px rgba(30,69,200,.45)}18%{border-color:#2A2A35;box-shadow:0 0 0 rgba(0,0,0,0)}}
.dimgroup:hover .dimcard{opacity:.35}
.dimgroup .dimcard{transition:opacity .3s cubic-bezier(.25,.1,.25,1),transform .3s cubic-bezier(.25,.1,.25,1)}
.dimgroup .dimcard:hover{opacity:1;transform:translateY(-4px)}

.lift{transition:transform .3s cubic-bezier(.25,.1,.25,1),box-shadow .3s cubic-bezier(.25,.1,.25,1)}
.lift:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(17,17,30,.08)}
.reveal.lift{transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1),box-shadow .3s}

/* process traveler */
.track{position:absolute;left:0;right:0;top:0;height:2px;background:#D5D5DC}
.traveler{position:absolute;top:-5px;left:0;width:120px;height:12px;margin-left:-120px;animation:travel 6s linear infinite;pointer-events:none}
@keyframes travel{from{left:0%}to{left:100%}}
.pdot{position:absolute;top:-6px;left:0;width:13px;height:13px;border-radius:50%;background:currentColor;animation:pulse 6s ease-out infinite}
.pdot.p1{animation-delay:1.2s}.pdot.p2{animation-delay:2.4s}.pdot.p3{animation-delay:3.6s}.pdot.p4{animation-delay:4.8s}
@keyframes pulse{0%{transform:scale(1);box-shadow:0 0 0 0 currentColor}4%{transform:scale(1.9);box-shadow:0 0 0 8px rgba(30,69,200,.18),0 0 24px 4px currentColor}22%{transform:scale(1);box-shadow:0 0 0 18px rgba(30,69,200,0)}100%{transform:scale(1);box-shadow:0 0 0 0 rgba(30,69,200,0)}}
.ptitle{animation:ptxt 6s ease-out infinite}
.ptitle.p1{animation-delay:1.2s}.ptitle.p2{animation-delay:2.4s}.ptitle.p3{animation-delay:3.6s}.ptitle.p4{animation-delay:4.8s}
@keyframes ptxt{0%,22%,100%{color:#111111}4%{color:var(--ac)}}

/* tabs / pills */
.pill{height:46px;padding:0 22px;border-radius:999px;font-size:15px;font-weight:600;cursor:pointer;background:#FFFFFF;color:#3A3A40;border:1px solid #D5D5DC;transition:background .25s,color .25s,border-color .25s}
.pill-lg{height:48px}
.pill[aria-selected="true"]{background:#111111;color:#FFFFFF;border-color:#111111}
.pill:hover{border-color:#111111}

/* products */
.pcard img{transition:transform .6s cubic-bezier(.25,.1,.25,1)}
.pcard:hover img{transform:scale(1.06)}
.pmore{opacity:0;transform:translateY(8px);transition:opacity .3s,transform .3s}
.pcard:hover .pmore,.pcard:focus-visible .pmore{opacity:1;transform:none}
.pcard:focus-visible{outline:2px solid var(--ac);outline-offset:3px}
.tabpanel{animation:cap .6s cubic-bezier(.2,.7,.2,1) both}

/* modal */
.modal-bg{animation:fadein .3s ease both}
.modal-panel{animation:panelin .45s cubic-bezier(.2,.7,.2,1) both}
@keyframes fadein{from{opacity:0}to{opacity:1}}
@keyframes panelin{from{opacity:0;transform:translateY(28px) scale(.98)}to{opacity:1;transform:none}}
#m-ratings{display:flex}
.m-rate{display:flex;align-items:center;gap:14px;font-size:13px}
.m-rate .l{width:130px;flex:none;color:#3A3A40}
.m-rate .b{flex:1;height:6px;border-radius:3px;background:#ECECF1;overflow:hidden}
.m-rate .b i{display:block;height:100%;background:var(--ac);border-radius:3px}
.m-rate .v{width:30px;text-align:right;color:#111111;font-weight:600}
.m-use{height:34px;padding:0 14px;display:inline-flex;align-items:center;border-radius:999px;border:1px solid #D5D5DC;font-size:13px;color:#3A3A40}
.m-spec{background:#F6F6F9;border-radius:12px;padding:14px 16px}
.m-spec dt{font-size:12px;color:#6B6B73}
.m-spec dd{margin:6px 0 0;font-size:14px;font-weight:600}
.m-rec-k{display:block;font-size:11px;letter-spacing:.14em;color:#9FA3B8;margin-bottom:4px}
.m-quote:hover{color:#FFFFFF;opacity:.94}
body.modal-open{overflow:hidden}

/* one-stop */
.ico{width:64px;height:64px;border-radius:50%;background:#EEF1FC;display:flex;align-items:center;justify-content:center;flex:none}
.flowwrap.on .stage{animation:stagehl 7.5s ease infinite}
.flowwrap.on .s1{animation-delay:1.5s}.flowwrap.on .s2{animation-delay:3s}.flowwrap.on .s3{animation-delay:4.5s}.flowwrap.on .s4{animation-delay:6s}
@keyframes stagehl{0%,100%{border-color:#E4E4EB;background-color:#FFFFFF;box-shadow:0 0 0 rgba(0,0,0,0)}4%,16%{border-color:var(--ac);background-color:#F5F7FF;box-shadow:0 18px 44px rgba(30,69,200,.16)}22%{border-color:#E4E4EB;background-color:#FFFFFF;box-shadow:0 0 0 rgba(0,0,0,0)}}
.nudge{animation:nudge 1.6s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}
.shine{position:relative;overflow:hidden}
.shine::after{content:"";position:absolute;inset:-2px;pointer-events:none;transform:translateX(-130%);background:linear-gradient(110deg,rgba(255,255,255,0) 28%,rgba(255,255,255,.3) 47%,rgba(255,255,255,.06) 54%,rgba(255,255,255,0) 70%)}
.shine.on::after,.on .shine::after{animation:sweep 6s 1s cubic-bezier(.3,.1,.3,1) infinite}
a.shine:hover{color:#FFFFFF}
.pulse-box{animation:pbox 2.4s ease-out infinite}
@keyframes pbox{0%{box-shadow:0 0 0 0 rgba(30,69,200,.45)}70%{box-shadow:0 0 0 18px rgba(30,69,200,0)}100%{box-shadow:0 0 0 0 rgba(30,69,200,0)}}
.show-sm{display:none}

/* cases */
.case-img img{transform:scale(1.08);transition:transform 1.2s cubic-bezier(.25,.1,.25,1)}
.case.is-active .case-img img{transform:scale(1)}
.case-dots .dot{height:8px;width:8px;border:none;padding:0;border-radius:4px;cursor:pointer;background:#C9C9D2;transition:width .4s,background .4s}
.case-dots .dot.is-active{width:32px;background:var(--ac)}
.case-prev:hover,.case-next:hover{transform:translateY(-2px)}
.case-prev,.case-next{transition:transform .2s}

/* clients */
.logo-cell{transition:opacity .7s ease,transform .7s ease,filter .3s}
.js .logo-cell{opacity:0;transform:translateY(18px)}
.js .on .logo-cell{opacity:1;transform:none}
.logo-cell img{transition:transform .3s}
.logo-cell:hover img{transform:scale(1.06)}

/* form */
.wbg-form input::placeholder,.wbg-form textarea::placeholder{color:#6B6B78}
.wbg-form input:focus,.wbg-form textarea:focus{outline:none;border-color:var(--ac)!important;box-shadow:0 0 0 3px rgba(30,69,200,.25)}
.wbg-form button[type=submit]{transition:opacity .2s,transform .2s}
.wbg-form button[type=submit]:hover{opacity:.92}
.wbg-form button[disabled]{opacity:.6;cursor:wait}
.form-msg.ok{color:#7CE3A1!important}
.form-msg.err{color:#FF8A8A!important}

/* footer */
.site-ftr a:hover{color:#FFFFFF!important}
.ftr-menu{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ftr-menu a{color:#C4C6D2}

/* ===== 서브 페이지 (약관 등) ===== */
.sub-wrap{max-width:860px;margin:0 auto;padding:150px 24px 120px;min-height:60vh}
.sub-kicker{margin:0 0 14px;font-size:13px;font-weight:600;letter-spacing:.16em;color:var(--ac)}
.sub-title{margin:0 0 40px;font-size:clamp(30px,3.6vw,46px);font-weight:700;letter-spacing:-.03em;line-height:1.3}
.sub-thumb img{width:100%;height:auto;border-radius:20px;margin-bottom:32px}
.entry{font-size:16px;line-height:1.85;color:#33333A}
.entry h2{margin:44px 0 12px;font-size:21px;font-weight:700;color:#111}
.entry h3{margin:32px 0 10px;font-size:18px;font-weight:700;color:#111}
.entry a{color:var(--ac);text-decoration:underline}
.entry img{height:auto;border-radius:12px}
.entry table{width:100%;border-collapse:collapse}.entry td,.entry th{border:1px solid #E4E4EB;padding:10px}
.sub-btn{display:inline-flex;align-items:center;height:52px;padding:0 26px;border-radius:999px;background:#111;color:#fff;font-weight:600}
.sub-btn:hover{color:#fff;opacity:.9}
.post-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:24px}
.post-item a{display:block}
.post-item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:16px}
.post-item h2{margin:6px 0 8px;font-size:19px;font-weight:600}
.post-item p{margin:0;font-size:14px;color:#6B6B73;line-height:1.6}
.post-date{font-size:13px;color:#8A8A94;display:block;margin-top:14px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .about-words .aw{opacity:1!important;transform:none!important;filter:none!important}
  .about-txt{opacity:1!important;transform:none!important}
}

/* ===== MOBILE ===== */
@media (max-width:760px){
  [style*="padding: 140px 32px"]{padding-top:72px!important;padding-bottom:72px!important;padding-left:20px!important;padding-right:20px!important}
  [style*="padding: 0 32px"]{padding-left:20px!important;padding-right:20px!important}
  [style*="padding: 0 32px; height: 80px"]{height:64px!important;gap:10px!important}
  [style*="padding: 110px 32px 40px"]{padding:56px 20px 16px!important}
  [style*="padding: 56px 32px 64px"]{padding:40px 20px 48px!important}
  [style*="margin-top: 140px"]{margin-top:76px!important}
  [style*="margin-top: 110px"]{margin-top:64px!important}
  [style*="margin-top: 96px"]{margin-top:60px!important}
  [style*="margin-bottom: 150px"]{margin-bottom:80px!important}
  [style*="margin-top: 72px"],[style*="margin-top: 64px"],[style*="margin-top: 60px"],[style*="margin-top: 56px"]{margin-top:32px!important}
  [style*="font-size: 18px; line-height: 1.7; color: #55555E"],[style*="font-size: 17px; line-height: 1.8; color: #55555E"]{font-size:15px!important}
  .hdr-cta{height:36px;padding:0 12px;font-size:12px}
  [style*="height: 60px; border-radius: 12px"]{font-size:12px!important;height:52px!important}
  .hdr-logo{height:24px!important;width:auto}
  .lang a{height:28px;min-width:30px;padding:0 7px;font-size:12px}
  html{scroll-padding-top:68px}

  /* 가로 스와이프 */
  .hscroll{display:flex!important;flex-wrap:nowrap!important;grid-template-columns:none!important;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;gap:12px!important;margin-left:-20px!important;margin-right:-20px!important;padding:6px 20px 14px!important;scroll-padding-left:20px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .hscroll::-webkit-scrollbar{display:none}
  .hscroll>*{flex:0 0 78%!important;scroll-snap-align:start;min-width:0;box-sizing:border-box}
  .hs-46>*{flex-basis:46%!important}.hs-62>*{flex-basis:62%!important}.hs-70>*{flex-basis:70%!important}.hs-84>*{flex-basis:84%!important}.hs-88>*{flex-basis:88%!important}
  .show-sm{display:flex}

  /* hero */
  .hero{height:auto!important;min-height:680px}
  .hero-inner{height:auto!important;padding-top:118px!important;padding-bottom:24px!important;justify-content:flex-start!important}
  .hero-inner p.en{font-size:11px!important;letter-spacing:.12em!important;margin-bottom:18px!important}
  .hero-inner h1{font-size:34px!important;line-height:1.24!important}
  .hero-inner a{height:50px!important;padding:0 20px!important;font-size:14px!important}
  .hero-inner .rise.r4{margin-top:30px!important}
  .hero-bottom{position:relative!important;bottom:auto!important;padding-bottom:32px}
  .hero-bottom .cap p:last-child{font-size:15px!important}
  .ind{width:64px!important}
  .ind-label{display:none!important}

  /* stats */
  .stat-item{padding:22px 16px 6px 0!important}
  .stat-item p:first-child{font-size:44px!important}
  .stat-item p+p{font-size:13px!important}

  /* about */
  .about-sec{height:860px!important}
  .about-sec>div{top:70px!important;padding:32px 20px!important}

  /* problem: 작은 박스 */
  .chain-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .chain-card{padding:14px 14px 16px!important;min-height:0!important;gap:3px!important;border-radius:12px!important}
  .chain-card span{font-size:11px!important}
  .chain-card p{font-size:15px!important}
  .chain-card p+p{font-size:12px!important;line-height:1.5!important}

  /* one-stop */
  .fstats{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .fstats>div{padding:18px 8px!important;flex-direction:column;align-items:center!important;gap:4px!important;text-align:center}
  .fstats>div>span:first-child{font-size:26px!important}
  .fstats>div>span:last-child{font-size:11px!important;line-height:1.4}
  .chips5{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:4px!important}
  .chips5>div{height:52px!important;font-size:11px!important;text-align:center;padding:0 2px!important;line-height:1.25}
  .ppath{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}

  /* service */
  .svc{min-height:320px!important;padding:28px 24px!important}

  /* products: 탭 한 줄 */
  .ptabs{width:100%;flex-wrap:nowrap!important;gap:6px!important}
  .ptab{flex:1 1 0;padding:0 6px!important;height:42px!important;font-size:13px!important;white-space:nowrap}

  /* cases */
  .case-img{min-height:230px!important;flex-basis:100%!important}
  .case-body{padding:24px 20px 28px!important}
  .case-hl{font-size:44px!important}

  /* clients */
  .logos-s{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .logos-s>div{height:96px!important}
  .logos-m{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .logos-m>div{height:64px!important}

  /* process */
  .track{display:none}
  .proc{padding-top:16px!important}
  .proc>li{padding:30px 16px 18px!important;background:#FFFFFF;border-radius:16px}
  .proc .pdot{top:14px;left:16px}

  /* modal */
  .modal-bg{padding:10px!important;align-items:flex-end!important}
  .m-img{min-height:210px!important;flex-basis:100%!important}
  .m-body{padding:24px 20px 28px!important}
  .m-rate .l{width:96px}

  .sub-wrap{padding:110px 20px 80px}
}
@media (max-width:430px){.hdr-cta{display:none!important}}