/* v246 · About — 메인과 같은 결의 스크롤 장면. 블록 바탕에 텍스처 없음(검정 · 유리 · 헤어라인), 사진은 풀블리드 장면에만 */

/* ── How we work: 고정 장면 · 큰 영단어 ── */
#app .hw{padding-top:0 !important;padding-bottom:0 !important}
#app .hw-pin{position:relative;height:420vh}
#app .hw-stick{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
#app .hw-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(32px,5vw,96px);align-items:center;margin-top:clamp(18px,2vw,32px)}
#app .hw-words{list-style:none;margin:0;padding:0}
#app .hw-words li{position:relative;display:block;width:max-content;cursor:pointer;font:800 clamp(64px,8.6vw,148px)/.98 var(--en);letter-spacing:-.055em;
 color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.2);transition:color .6s,-webkit-text-stroke-color .6s,transform .8s cubic-bezier(.22,1,.36,1);transform:translateX(0)}
#app .hw-words li.past{-webkit-text-stroke-color:rgba(255,255,255,.34)}
#app .hw-words li.on{color:#fff;-webkit-text-stroke-color:#fff;transform:translateX(clamp(12px,1.6vw,28px))}
#app .hw-words li i{position:absolute;left:0;right:0;bottom:.06em;height:2px;background:#fd4533;transform:scaleX(0);transform-origin:0 50%;transition:transform .8s cubic-bezier(.22,1,.36,1);box-shadow:0 0 14px rgba(253,69,51,.45)}
#app .hw-words li.on i{transform:scaleX(1)}
#app .hw-copy{position:relative;min-height:260px;padding-left:28px}
#app .hw-c{position:absolute;inset:0 0 auto 28px;opacity:0;transform:translateY(18px);transition:opacity .5s,transform .7s cubic-bezier(.22,1,.36,1);pointer-events:none}
#app .hw-c.on{opacity:1;transform:none;pointer-events:auto}
#app .hw-n{margin:0 0 18px;font:500 14px/1 var(--en);letter-spacing:.08em;color:rgba(255,255,255,.4)}
#app .hw-n b{color:#fd4533;font-weight:700}
#app .hw-c h3{margin:0 0 16px;font:750 clamp(28px,2.6vw,40px)/1.22 var(--kr);letter-spacing:-.045em;color:#fff}
#app .hw-c p:last-child{margin:0;font:400 clamp(16px,1.2vw,18px)/1.75 var(--kr);color:rgba(255,255,255,.72);word-break:keep-all}
#app .hw-bar{position:absolute;left:0;top:0;bottom:0;width:1px;background:rgba(255,255,255,.12)}
#app .hw-bar i{position:absolute;inset:0;background:#fd4533;transform:scaleY(0);transform-origin:50% 0}

/* ── Organization: 고정 장면 · 가로 패널 ── */
#app .ogx{padding-top:0 !important;padding-bottom:0 !important}
#app .ogx-pin{position:relative;height:340vh}
#app .ogx-stick{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;gap:clamp(22px,3vh,36px);overflow:hidden}
#app .ogx-head{display:grid;grid-template-columns:auto 1fr;align-items:end;column-gap:40px}
#app .ogx-head .section-index{grid-column:1/-1}
#app .ogx-h{margin:0;font:750 clamp(32px,3.6vw,56px)/1.2 var(--kr);letter-spacing:-.05em;color:#fff}
#app .ogx-s{margin:0;justify-self:end;font:400 clamp(15px,1.1vw,17px)/1.6 var(--kr);color:rgba(255,255,255,.62)}
#app .ogx-track{display:flex;gap:clamp(16px,1.6vw,24px);padding-left:var(--wl,72px);will-change:transform}
#app .ogx-p{position:relative;flex:0 0 min(56vw,860px);height:min(58vh,560px);border-radius:18px;overflow:hidden;background:#0b0b0d;border:1px solid rgba(255,255,255,.1);transition:border-color .6s}
#app .ogx-p img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.2) brightness(.62);transform:scale(1.06);transition:transform 1.4s cubic-bezier(.22,1,.36,1),filter 1s}
#app .ogx-p.on img{transform:scale(1);filter:grayscale(0) brightness(.75)}
#app .ogx-p::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,8,10,.92) 0%,rgba(8,8,10,.6) 42%,rgba(8,8,10,0) 75%)}
#app .ogx-p.on{border-color:rgba(255,255,255,.24)}
#app .ogx-p.is-lead{border-color:rgba(253,69,51,.4)}
#app .ogx-in{position:absolute;left:clamp(28px,3vw,52px);bottom:clamp(28px,3vw,48px);right:45%;z-index:1}
#app .ogx-no{display:block;margin-bottom:auto;font:300 clamp(60px,6vw,104px)/1 var(--en);letter-spacing:-.05em;color:rgba(255,255,255,.16);position:absolute;bottom:calc(100% + 18px);left:0}
#app .ogx-k{margin:0 0 10px;font:700 12.5px/1 var(--en);letter-spacing:.18em;color:#fd4533}
#app .ogx-in h3{margin:0 0 18px;font:750 clamp(26px,2.4vw,38px)/1.2 var(--kr);letter-spacing:-.045em;color:#fff}
#app .ogx-in ul{list-style:none;margin:0;padding:0}
#app .ogx-in li{padding:10px 0;border-top:1px solid rgba(255,255,255,.12);font:400 15px/1.4 var(--kr);color:rgba(255,255,255,.8)}
#app .ogx-foot{}
#app .ogx-prog{height:1px;background:rgba(255,255,255,.12);position:relative}
#app .ogx-prog i{position:absolute;inset:0;background:#fd4533;transform:scaleX(0);transform-origin:0 50%}

/* ── Capability: 파사드 위 숫자 타일 ── */
#app .abcap{position:relative;overflow:hidden;padding-top:clamp(120px,12vw,180px) !important;padding-bottom:clamp(120px,12vw,180px) !important}
#app .abcap .cap-bg{position:absolute;inset:-80px 0;z-index:0;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent,#000 18%,#000 82%,transparent);mask-image:linear-gradient(180deg,transparent,#000 18%,#000 82%,transparent)}
#app .abcap .cap-bg img{width:100%;height:100%;object-fit:cover;opacity:.55;transform:scale(1.15);will-change:transform}
#app .abcap>.wrap{position:relative;z-index:1}
#app .cap-h{margin:18px 0 22px;font:750 clamp(36px,4.2vw,66px)/1.18 var(--kr);letter-spacing:-.055em;color:#fff}
#app .cap-s{max-width:560px;margin:0 0 clamp(48px,6vw,96px);font:400 clamp(16px,1.2vw,18px)/1.75 var(--kr);color:rgba(255,255,255,.72);word-break:keep-all}
#app .cap-tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1.25fr repeat(4,1fr);gap:clamp(8px,.9vw,14px)}
#app .cap-t{position:relative;display:flex;flex-direction:column;min-height:clamp(200px,17vw,250px);padding:clamp(20px,1.8vw,28px);border-radius:14px;background:rgba(14,14,16,.5);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);transition:transform .6s cubic-bezier(.22,1,.36,1),border-color .5s}
#app .cap-t:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.28)}
#app .cap-t.is-key{background:#fd4533;border-color:#fd4533}
#app .cap-k{margin:0;font:700 11.5px/1 var(--en);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6)}
#app .cap-t.is-key .cap-k{color:rgba(255,255,255,.85)}
#app .cap-t b{margin-top:auto;font:300 clamp(52px,5vw,84px)/1 var(--en);letter-spacing:-.05em;color:#fff}
#app .cap-t b small{font:500 .3em/1 var(--en);margin-left:.08em;letter-spacing:0}
#app .cap-t .cap-cnt{font:inherit;color:inherit;-webkit-text-fill-color:currentColor}
#app .cap-t b.cap-word{font:750 clamp(26px,2.2vw,34px)/1.1 var(--kr);letter-spacing:-.04em}
#app .cap-d{margin:14px 0 0;font:400 13.5px/1.5 var(--kr);color:rgba(255,255,255,.72);word-break:keep-all}
#app .cap-t.is-key .cap-d{color:rgba(255,255,255,.92)}

/* ── History: 고정 연도 · 월 ── */
#app .abh-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,96px);margin-top:clamp(24px,3vw,40px)}
#app .abh-stick{position:sticky;top:18vh;align-self:start}
#app .abh-y{margin:0;font:800 clamp(90px,11vw,190px)/.9 var(--en);letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.28)}
#app .abh-m{margin:-.15em 0 0;display:flex;align-items:baseline;gap:10px}
#app .abh-mm{display:inline-block;font:800 clamp(90px,11vw,190px)/.9 var(--en);letter-spacing:-.06em;color:#fd4533}
#app .abh-mm.flip{animation:abhFlip .55s cubic-bezier(.22,1,.36,1)}
@keyframes abhFlip{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
#app .abh-m span{font:700 clamp(22px,2vw,30px)/1 var(--kr);color:rgba(255,255,255,.7)}
#app .abh-s{margin:28px 0 0;font:400 16px/1.7 var(--kr);color:rgba(255,255,255,.6)}
#app .abh-list{list-style:none;margin:0;padding:0 0 30vh}
#app .abh-r{display:grid;grid-template-columns:76px 1fr;gap:20px;padding:clamp(22px,2.2vw,30px) 0;border-top:1px solid rgba(255,255,255,.1);opacity:.38;transition:opacity .5s}
#app .abh-r.on{opacity:1}
#app .abh-d{font:500 15px/1.5 var(--en);letter-spacing:.04em;color:rgba(255,255,255,.55)}
#app .abh-r.on .abh-d{color:#fd4533}
#app .abh-tg{margin:0 0 8px;font:700 11.5px/1 var(--kr);letter-spacing:.06em;color:rgba(255,255,255,.5)}
#app .abh-r h3{margin:0 0 6px;font:700 clamp(19px,1.6vw,24px)/1.35 var(--kr);letter-spacing:-.03em;color:#fff}
#app .abh-me{margin:0;font:400 15px/1.5 var(--kr);color:rgba(255,255,255,.6)}

/* ── Life: 단어 단위 선언 · 큰 줄 · 흐르는 복지 ── */
#app .lfx-h{margin:18px 0 28px;font:800 clamp(44px,6.2vw,108px)/1.08 var(--kr);letter-spacing:-.06em;color:#fff}
#app .lfx-l{display:block}
#app .lfx-w{--o:0;opacity:calc(.14 + var(--o) * .86);transition:opacity .2s}
#app .lfx-w.is-key{color:#fd4533}
#app .lfx-lead{max-width:600px;margin:0 0 clamp(64px,8vw,120px);font:400 clamp(16px,1.25vw,19px)/1.75 var(--kr);color:rgba(255,255,255,.72)}
#app .lfx-why{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.14)}
#app .lfx-r{display:grid;grid-template-columns:80px minmax(0,1fr) minmax(0,1.1fr);gap:clamp(16px,2.4vw,40px);align-items:baseline;padding:clamp(28px,3vw,44px) 0;border-bottom:1px solid rgba(255,255,255,.1);transition:padding .6s cubic-bezier(.22,1,.36,1)}
#app .lfx-r:hover{padding-left:16px}
#app .lfx-n{font:500 14px/1 var(--en);letter-spacing:.1em;color:#fd4533}
#app .lfx-r h3{margin:0;font:750 clamp(24px,2.4vw,38px)/1.25 var(--kr);letter-spacing:-.045em;color:#fff}
#app .lfx-r p{margin:0;font:400 16px/1.75 var(--kr);color:rgba(255,255,255,.7);word-break:keep-all}
#app .lfx-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:clamp(72px,8vw,128px) 0}
#app .lfx-stats>div{padding:0 clamp(12px,2vw,32px)}
#app .lfx-stats>div+div{border-left:1px solid rgba(255,255,255,.12)}
#app .lfx-stats b{display:block;font:300 clamp(80px,10vw,170px)/.9 var(--en);letter-spacing:-.06em;color:#fff}
#app .lfx-stats b small{font:500 .22em/1 var(--en);letter-spacing:0;margin-left:.06em;vertical-align:top;position:relative;top:.4em}
#app .lfx-stats .lf-cnt{font:inherit;color:inherit;-webkit-text-fill-color:currentColor;font-variant-numeric:tabular-nums}
#app .lfx-stats p{margin:16px 0 0;font:500 16px/1.4 var(--kr);color:rgba(255,255,255,.6)}
#app .lfx-ben{display:flex;flex-direction:column;gap:clamp(10px,1.2vw,16px);margin:0 calc(50% - 50vw);padding:clamp(24px,3vw,40px) 0;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}
#app .lfx-row{display:grid;grid-template-columns:calc(var(--wl,72px) + 110px) 1fr;align-items:center}
#app .lfx-k{margin:0;padding-left:var(--wl,72px);font:700 12px/1 var(--en);letter-spacing:.18em;text-transform:uppercase;color:#fd4533}
#app .lfx-mq{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
#app .lfx-tr{display:flex;align-items:center;gap:clamp(18px,2vw,32px);width:max-content;animation:lfxMq 46s linear infinite}
#app .lfx-row-1 .lfx-tr{animation-direction:reverse;animation-duration:38s}
#app .lfx-row-2 .lfx-tr{animation-duration:54s}
#app .lfx-ben:hover .lfx-tr{animation-play-state:paused}
#app .lfx-tr span{font:700 clamp(22px,2.4vw,38px)/1.2 var(--kr);letter-spacing:-.04em;color:#fff;white-space:nowrap;transition:color .3s}
#app .lfx-tr span:hover{color:#fd4533}
#app .lfx-tr i{font-style:normal;color:rgba(255,255,255,.25);font-size:clamp(18px,1.8vw,28px)}
@keyframes lfxMq{from{transform:translateX(0)}to{transform:translateX(-33.333%)}}

/* ── 반응형 ── */
@media (max-width:899px){
 #app .hw-pin,#app .ogx-pin{height:auto}
 #app .hw-stick,#app .ogx-stick{position:static;height:auto;padding:clamp(80px,14vw,120px) 0}
 #app .hw-grid{grid-template-columns:1fr}
 #app .hw-words{display:none}
 #app .hw-copy{min-height:0;padding-left:0}#app .hw-bar{display:none}
 #app .hw-c{position:static;opacity:1;transform:none;padding:22px 0;border-top:1px solid rgba(255,255,255,.12)}
 #app .ogx-head{grid-template-columns:1fr}#app .ogx-s{justify-self:start;margin-top:12px}
 #app .ogx-track{flex-direction:column;padding:0 24px;transform:none !important}
 #app .ogx-p{flex:none;height:auto;min-height:380px}#app .ogx-in{right:24px}
 #app .ogx-foot{display:none}
 #app .cap-tiles{grid-template-columns:1fr 1fr}#app .cap-t:first-child{grid-column:1/-1}
 #app .abh-grid{grid-template-columns:1fr}#app .abh-stick{position:static}#app .abh-list{padding-bottom:0}#app .abh-r{opacity:1}
 #app .lfx-r{grid-template-columns:1fr}
 #app .lfx-row{grid-template-columns:1fr;gap:10px}#app .lfx-k{padding-left:24px}
}
@media (max-width:560px){#app .lfx-stats{grid-template-columns:1fr;gap:28px}#app .lfx-stats>div+div{border-left:0;border-top:1px solid rgba(255,255,255,.12);padding-top:24px}#app .cap-t b{font-size:52px}}
@media (prefers-reduced-motion:reduce){#app .lfx-tr{animation:none}}

#app #org .ogx-in ul{display:block !important}
#app #org .ogx-in li{display:block !important;border:0 !important;border-top:1px solid rgba(255,255,255,.12) !important;border-radius:0 !important;padding:10px 0 !important;background:none !important;font:400 15px/1.4 var(--kr) !important;color:rgba(255,255,255,.8) !important}
#app .ogx-stick{margin-inline:calc(50% - 50vw)}
#app .ogx-head,#app .ogx-foot{padding-inline:var(--wl,72px)}
@media (max-width:899px){#app .ogx-stick{margin-inline:0}#app .ogx-head,#app .ogx-foot{padding-inline:0}#app .ogx-track{padding:0}}
@media (min-width:1200px){#app .loc-addr{white-space:nowrap}}@media (min-width:821px) and (max-width:1199px){#app .loc-addr{font-size:14px;white-space:nowrap;letter-spacing:-.02em}}

/* ── v246.2 다이내믹 고도화 ── */
/* 마우스 반응 벽돌 조각 파티클 */
#app canvas.dust{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
#app .hw-stick{position:sticky}
#app .hw-stick>.wrap,#app .lfx>.wrap{position:relative;z-index:1}
#app .lfx{position:relative;overflow:hidden}
/* How we work: 단어가 스크롤에 따라 왼쪽부터 채워짐 · 뒤에 큰 번호 · 은은한 빛 */
#app .hw-pin{height:300vh}
#app .hw-words li{color:transparent !important;background:linear-gradient(90deg,#fff var(--f,0%),rgba(255,255,255,0) var(--f,0%));-webkit-background-clip:text;background-clip:text;transition:-webkit-text-stroke-color .6s,transform .8s cubic-bezier(.22,1,.36,1)}
#app .hw-words li.past{background:linear-gradient(90deg,rgba(255,255,255,.22) 100%,transparent 100%);-webkit-background-clip:text;background-clip:text}
#app .hw-stick::before{content:"";position:absolute;right:-8vw;top:calc(12% + var(--hp,0) * 46%);width:52vw;height:52vw;border-radius:50%;background:radial-gradient(closest-side,rgba(253,69,51,.13),rgba(253,69,51,0));filter:blur(20px);pointer-events:none;z-index:0}
#app .hw-big{position:absolute;right:-.06em;top:-.42em;font:800 clamp(140px,15vw,260px)/1 var(--en);letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.08);pointer-events:none;z-index:-1}
#app .hw-c{z-index:1}
/* 키네틱 타이포 띠 */
#app .abk{position:relative;overflow:hidden;padding:clamp(40px,5vw,80px) 0;margin:0;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}
#app .abk-row{display:flex;align-items:center;gap:clamp(18px,2vw,36px);width:max-content;white-space:nowrap;will-change:transform}
#app .abk-row span{font:800 clamp(64px,9vw,160px)/1 var(--en);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.28)}
#app .abk-row i{font:300 clamp(40px,5vw,90px)/1 var(--en);font-style:normal;color:#fd4533}
#app .abk-row.is-b{margin-top:clamp(6px,1vw,14px)}
#app .abk-row.is-b span{font:700 clamp(30px,3.6vw,60px)/1.1 var(--en);letter-spacing:-.03em;color:rgba(255,255,255,.85);-webkit-text-stroke:0}
#app .abk-row.is-b span.is-key{color:#fd4533}
#app .abk-row.is-b i{font-size:clamp(24px,2.6vw,44px);color:rgba(255,255,255,.3)}
/* Organization: 제목 줄 정렬 · 짧게 · 커서 빛 */
#app .ogx-pin{height:260vh}
#app .ogx-head{padding-inline:var(--wl,72px);box-sizing:border-box;width:100%}
#app .ogx-foot{padding-inline:var(--wl,72px);box-sizing:border-box;width:100%}
#app .ogx-track{padding-left:var(--wl,72px)}
#app .ogx-p img{transition:transform 1.4s cubic-bezier(.22,1,.36,1),filter 1s,translate .8s cubic-bezier(.22,1,.36,1)}
#app .ogx-p::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(420px circle at var(--mx,70%) var(--my,40%),rgba(253,69,51,.14),transparent 60%);opacity:0;transition:opacity .5s}
#app .ogx-p:hover::before{opacity:1}
#app .ogx-in{z-index:2}
#app .ogx-no{color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.35)}
#app .ogx-p.on .ogx-no{-webkit-text-stroke-color:#fd4533}
/* Capability: 타일 커서 스포트라이트 */
#app .cap-t{overflow:hidden}
#app .cap-t::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(260px circle at var(--sx,50%) var(--sy,50%),rgba(255,255,255,.12),transparent 60%);opacity:0;transition:opacity .4s}
#app .cap-t:hover::before{opacity:1}
#app .cap-t>*{position:relative}
@media (max-width:899px){#app .hw-big{display:none}#app .hw-stick::before{display:none}#app .ogx-head,#app .ogx-foot{padding-inline:0}#app .ogx-track{padding-left:0}}
#app .hw-words li{line-height:1.06;padding-bottom:.06em}

/* ── Organization v3: 유리판 세 장 + 전략기획 빛의 토대 (브랜드 심볼의 문법) ── */
#app .ogs{padding-top:0 !important;padding-bottom:0 !important}
#app .ogs-pin{position:relative;height:300vh}
#app .ogs-stick{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
#app .ogs-head{position:relative;z-index:2}
#app .ogs-h{margin:14px 0 0;font:750 clamp(32px,3.6vw,56px)/1.2 var(--kr);letter-spacing:-.05em;color:#fff}
#app .ogs-stage{position:relative;height:min(64vh,620px);--e:0;--p:0}
#app .ogs-scene{position:absolute;left:50%;top:50%;width:0;height:0;perspective:1800px}
#app .ogs-stk{position:absolute;left:0;top:0;transform-style:preserve-3d;transform:rotateX(60deg) rotateZ(-40deg) translateZ(calc(-80px - var(--e) * 120px))}
#app .ogs-pl{position:absolute;left:calc(clamp(220px,20vw,320px) / -2);top:calc(clamp(220px,20vw,320px) / -2);width:clamp(220px,20vw,320px);aspect-ratio:1;border-radius:10px;
 transform:translateZ(calc(var(--i) * (16px + var(--e) * 92px)));transition:transform .9s cubic-bezier(.22,1,.36,1),border-color .6s,background .6s,box-shadow .6s;
 background:linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.03) 60%);border:1px solid rgba(255,255,255,.28);box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 0 0 rgba(0,0,0,0)}
#app .ogs-pl b{position:absolute;inset:14%;border:1px solid rgba(255,255,255,.08);border-radius:6px}
#app .ogs-pl.lit{border-color:rgba(255,255,255,.5)}
#app .ogs-pl.on{transform:translateZ(calc(var(--i) * (16px + var(--e) * 92px) + 22px));border-color:#fd4533;background:linear-gradient(135deg,rgba(253,69,51,.32),rgba(253,69,51,.06) 65%);box-shadow:0 0 60px rgba(253,69,51,.35)}
#app .ogs-base{background:radial-gradient(closest-side,rgba(253,69,51,.55),rgba(253,69,51,.12) 70%,rgba(253,69,51,.04));border-color:rgba(253,69,51,.55);box-shadow:0 0 90px rgba(253,69,51,.35)}
#app .ogs-base.on{background:radial-gradient(closest-side,rgba(253,69,51,.75),rgba(253,69,51,.2) 70%,rgba(253,69,51,.06))}
#app .ogs-glow{position:absolute;left:50%;top:58%;width:min(46vw,620px);aspect-ratio:2;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(253,69,51,.16),rgba(253,69,51,0));filter:blur(24px);pointer-events:none}
#app .ogs-notes{list-style:none;margin:0;padding:0;position:absolute;inset:0;pointer-events:none}
#app .ogs-n{position:absolute;left:0;right:0;height:0;opacity:.35;transition:opacity .6s}
#app .ogs-n.lit{opacity:.7}#app .ogs-n.on{opacity:1}
#app .ogs-line{position:absolute;top:0;height:1px;background:rgba(255,255,255,.35)}
#app .ogs-line::after{content:"";position:absolute;top:-3px;width:7px;height:7px;border-radius:50%;background:#fff}
#app .ogs-n:not(.is-r) .ogs-line::after{right:-3px}
#app .ogs-n.is-r .ogs-line::after{left:-3px}
#app .ogs-n.on .ogs-line{background:#fd4533}#app .ogs-n.on .ogs-line::after{background:#fd4533;box-shadow:0 0 0 4px rgba(253,69,51,.2)}
#app .ogs-tx{position:absolute;top:0;width:min(30%,380px);transform:translateY(-22px)}
#app .ogs-n:not(.is-r) .ogs-tx{right:calc(64% + 18px);text-align:right}
#app .ogs-n.is-r .ogs-tx{left:calc(64% + 18px)}
#app .ogs-k{margin:0 0 8px;font:700 12px/1 var(--en);letter-spacing:.18em;color:#fd4533}
#app .ogs-tx h3{margin:0;font:750 clamp(22px,2vw,30px)/1.2 var(--kr);letter-spacing:-.04em;color:#fff}
#app .ogs-s{margin:8px 0 0;font:500 15px/1.4 var(--kr);color:rgba(255,255,255,.7)}
#app .ogs-tx ul{list-style:none;margin:0;padding:0;max-height:0;overflow:hidden;opacity:0;transition:max-height .7s cubic-bezier(.22,1,.36,1),opacity .5s,margin .5s}
#app .ogs-n.on .ogs-tx ul{max-height:160px;opacity:1;margin-top:14px}
#app .ogs-tx li{padding:7px 0;font:400 14.5px/1.4 var(--kr);color:rgba(255,255,255,.78)}
#app .ogs-n:not(.is-r) .ogs-tx li{border-right:2px solid rgba(253,69,51,.5);padding-right:12px}
#app .ogs-n.is-r .ogs-tx li{border-left:2px solid rgba(253,69,51,.5);padding-left:12px}
#app .ogs-foot{position:relative;z-index:2;margin-top:0;font:400 clamp(15px,1.1vw,17px)/1.6 var(--kr);color:rgba(255,255,255,.62);text-align:center}
@media (max-width:899px){
 #app .ogs-pin{height:auto}#app .ogs-stick{position:static;height:auto;padding:90px 0}
 #app .ogs-stage{height:auto;--e:.6}#app .ogs-scene{position:relative;left:auto;top:auto;width:100%;height:300px;display:block}#app .ogs-stk{left:50%;top:60%}
 #app .ogs-notes{position:static;margin-top:10px}#app .ogs-n{position:static;height:auto;opacity:1;padding:20px 0;border-top:1px solid rgba(255,255,255,.12)}#app .ogs-line{display:none}
 #app .ogs-tx{position:static;width:auto;transform:none;text-align:left !important}#app .ogs-tx ul{max-height:none;opacity:1;margin-top:12px}
 #app .ogs-n:not(.is-r) .ogs-tx li{border-right:0;border-left:2px solid rgba(253,69,51,.5);padding:7px 0 7px 12px}
 #app .ogs-pl{--e:.6}
}
#app #org .ogs-notes>li.ogs-n{display:block !important;border:0 !important;border-radius:0 !important;padding:0 !important;background:none !important;width:auto !important;font:inherit !important}
#app #org .ogs-tx ul{display:block !important;flex-direction:initial !important}
#app #org .ogs-tx li{display:block !important;border-radius:0 !important;border-top:0 !important;border-bottom:0 !important;background:none !important;width:auto !important}
#app #org .ogs-n:not(.is-r) .ogs-tx li{border-left:0 !important;border-right:2px solid rgba(253,69,51,.5) !important}
#app #org .ogs-n.is-r .ogs-tx li{border-right:0 !important;border-left:2px solid rgba(253,69,51,.5) !important}
@media (min-width:900px){#app .ogs-n{opacity:calc(.35 * var(--e))}#app .ogs-n.lit{opacity:calc(.7 * var(--e))}#app .ogs-n.on{opacity:calc(.25 + .75 * var(--e))}#app .ogs-n.is-base.on{opacity:1}}
@media (max-width:899px){#app #org .ogs-n:not(.is-r) .ogs-tx li{border-right:0 !important;border-left:2px solid rgba(253,69,51,.5) !important}}

/* ── v247 · OKGO 문법: 상징 오브젝트 하나 + 편집 디자인 목록 ── */
/* Our Approach */
#app .apr-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,96px)}
#app .apr-vis{position:relative}
#app .apr-stick{position:sticky;top:0;height:100vh;display:flex;align-items:center;justify-content:center}
#app .apr-cv{width:100%;height:min(78vh,720px);display:block;opacity:0;transition:opacity 1.2s}
#app .apr-cv.is-ready{opacity:1}
#app .apr-cap{position:absolute;left:0;bottom:9vh;display:flex;gap:14px;align-items:baseline;margin:0;font:500 12px/1 var(--en);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.5)}
#app .apr-cap b{color:#fd4533;font-weight:700}
#app .apr-now{color:#fff}
#app .apr-flow{padding:22vh 0 18vh}
#app .apr-blk{min-height:70vh;padding-bottom:16vh}
#app .apr-blk:last-child{min-height:0;padding-bottom:0}
#app .apr-h{margin:18px 0 40px;font:750 clamp(40px,4.6vw,76px)/1.12 var(--kr);letter-spacing:-.055em;color:#fff}
#app .apr-bi{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding-top:22px;border-top:1px solid rgba(255,255,255,.14)}
#app .apr-bi p{margin:0;font:400 15px/1.75 var(--kr);color:rgba(255,255,255,.72);word-break:keep-all}
#app .apr-bi p[lang=en]{font:400 15px/1.6 var(--en);color:rgba(255,255,255,.52)}
#app .apr-t{margin:0 0 26px;font:500 clamp(30px,3vw,48px)/1.1 var(--en);letter-spacing:-.04em;color:#fff}
#app .apr-lead{margin:-10px 0 26px;font:400 16px/1.6 var(--kr);color:rgba(255,255,255,.62)}
#app .apr-rows,#app .apr-team{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.16)}
#app .apr-r{display:grid;grid-template-columns:54px 1fr;gap:10px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.1);transition:padding .5s cubic-bezier(.22,1,.36,1)}
#app .apr-r:hover{padding-left:10px}
#app .apr-no{font:500 13px/1.6 var(--en);color:rgba(255,255,255,.4)}
#app .apr-r:hover .apr-no{color:#fd4533}
#app .apr-e{margin:0 0 6px;font:600 11px/1 var(--en);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.42)}
#app .apr-r h4{margin:0 0 6px;font:700 clamp(19px,1.5vw,23px)/1.3 var(--kr);letter-spacing:-.03em;color:#fff}
#app .apr-d{margin:0;font:400 15px/1.65 var(--kr);color:rgba(255,255,255,.66);word-break:keep-all}
#app .apr-m{position:relative;display:grid;grid-template-columns:150px 1fr;column-gap:16px;row-gap:6px;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.1);cursor:default;outline:0;transition:padding .5s cubic-bezier(.22,1,.36,1)}
#app .apr-m::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:0;background:#fd4533;transition:width .7s cubic-bezier(.22,1,.36,1)}
#app .apr-m.on{padding-left:12px}#app .apr-m.on::before{width:100%}
#app .apr-mk{grid-row:span 2;font:700 12px/1.6 var(--en);letter-spacing:.14em;color:rgba(255,255,255,.45);transition:color .4s}
#app .apr-m.on .apr-mk{color:#fd4533}
#app .apr-m b{font:700 clamp(19px,1.5vw,23px)/1.3 var(--kr);letter-spacing:-.03em;color:rgba(255,255,255,.7);transition:color .4s}
#app .apr-m.on b{color:#fff}
#app .apr-md{font:400 14.5px/1.6 var(--kr);color:rgba(255,255,255,.55)}
/* Capabilities: 흩어진 정사각 선 카드 */
#app .cpx-field{position:relative;height:clamp(900px,78vw,1180px)}
#app .cpx-h{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;text-align:center;font:750 clamp(36px,4.2vw,68px)/1.15 var(--kr);letter-spacing:-.055em;color:#fff;z-index:2;pointer-events:none}
#app .cpx-h .section-index{display:flex;justify-content:center;margin-bottom:22px}
#app .cpx-c{position:absolute;width:clamp(210px,17vw,280px);aspect-ratio:3/4;display:flex;flex-direction:column;padding:20px;border:1px solid rgba(255,255,255,.55);color:#fff;text-decoration:none;background:rgba(10,10,12,.55);transition:border-color .5s,background .5s,transform .6s cubic-bezier(.22,1,.36,1);z-index:1}
#app .cpx-c:hover{border-color:#fd4533;background:rgba(253,69,51,.06);transform:translateY(-6px)}
#app .cpx-0{left:3%;top:4%}#app .cpx-1{right:6%;top:0}#app .cpx-2{left:30%;bottom:2%}#app .cpx-3{right:1%;bottom:12%}
#app .cpx-ico{width:100%;aspect-ratio:1;height:auto;margin:auto 0}
#app .cpx-n{font:600 clamp(17px,1.4vw,21px)/1.1 var(--en);letter-spacing:.01em}
#app .cpx-s{margin-top:6px;font:400 13.5px/1.4 var(--kr);color:rgba(255,255,255,.62)}
#app .cpx-no{position:absolute;right:18px;bottom:20px;font:500 14px/1 var(--en);font-style:normal;padding:6px 10px;border:1px solid rgba(255,255,255,.6);border-radius:999px;transition:border-color .4s,color .4s}
#app .cpx-c:hover .cpx-no{border-color:#fd4533;color:#fd4533}
/* Achievements: 두 칸 목록 */
#app .acx-h{margin:0 0 clamp(36px,4vw,64px);font:500 clamp(44px,5vw,84px)/1 var(--en);letter-spacing:-.045em;color:#fff}
#app .acx-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,72px)}
#app .acx-t{margin:0 0 16px;font:500 clamp(20px,1.7vw,26px)/1.2 var(--en);letter-spacing:-.02em;color:#fff}
#app .acx-list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.22)}
#app .acx-list li{display:flex;justify-content:space-between;gap:20px;align-items:baseline;padding:14px 4px;border-bottom:1px solid rgba(255,255,255,.1);transition:background .3s,padding .4s}
#app .acx-list li:hover{background:rgba(255,255,255,.03);padding-left:12px}
#app .acx-list span{font:500 15.5px/1.45 var(--kr);color:rgba(255,255,255,.88)}
#app .acx-list small{flex:none;font:500 13px/1.45 var(--en);color:rgba(255,255,255,.45);letter-spacing:.03em}
#app .acx-list li:hover small{color:#fd4533}
@media (max-width:899px){
 #app .apr-grid{grid-template-columns:1fr}#app .apr-stick{position:relative;height:60vh}#app .apr-cap{bottom:2vh}
 #app .apr-flow{padding:20px 0 0}#app .apr-blk{min-height:0;padding-bottom:64px}#app .apr-bi{grid-template-columns:1fr}
 #app .apr-m{grid-template-columns:1fr}#app .apr-mk{grid-row:auto}
 #app .cpx-field{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:12px}#app .cpx-h{position:static;transform:none;grid-column:1/-1;margin-bottom:24px;text-align:left}#app .cpx-h .section-index{justify-content:flex-start}
 #app .cpx-c{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:auto;translate:none !important}
 #app .acx-grid{grid-template-columns:1fr}
}
#app #org.apr-blk ol,#app #org.apr-blk ul{display:block !important}
#app #org .apr-m{display:grid !important;border:0 !important;border-bottom:1px solid rgba(255,255,255,.1) !important;border-radius:0 !important;background:none !important;width:auto !important;padding:20px 0 !important}
#app #org .apr-m.on{padding-left:12px !important}
@media (max-width:899px){#app .cpx-field{grid-template-columns:repeat(2,minmax(0,1fr))}#app .cpx-c{min-width:0;padding:16px 14px 46px}#app .cpx-ico{max-width:100%}#app .cpx-no{right:12px;bottom:12px;font-size:12px;padding:4px 8px}#app .cpx-s{font-size:12.5px}}
#app .apr-flow{padding-bottom:6vh}#app #approach{padding-bottom:0 !important}
/* Our Approach: 심볼 없이 글 · 목록만 */
#app .apr-grid{display:block}
#app .apr-flow{padding:0 !important}
#app .apr-blk{min-height:0 !important;padding-bottom:clamp(80px,9vw,140px)}
#app .apr-blk[data-step=intro]{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);column-gap:clamp(32px,5vw,96px);align-items:end}
#app .apr-blk[data-step=intro] .section-index{grid-column:1/-1}
#app .apr-blk[data-step=intro] .apr-h{margin-bottom:0}
#app .apr-blk[data-step=principles]{display:grid;grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr);column-gap:clamp(32px,5vw,96px);align-items:start}
#app .apr-blk[data-step=principles] .apr-t{position:sticky;top:120px}
#app #approach{padding-bottom:0 !important}
@media (max-width:899px){#app .apr-blk[data-step=intro],#app .apr-blk[data-step=principles]{grid-template-columns:1fr}#app .apr-blk[data-step=principles] .apr-t{position:static}#app .apr-bi{margin-top:28px}}

/* ── 모든 About 섹션 머리를 Our Story에 맞춤: 한글 머리말 · 큰 영문 제목(마지막 단어 키컬러) · 무슨 이야기인지 두 줄 ── */
#app .abh{text-align:center;margin:0 auto clamp(64px,7vw,112px);max-width:1200px}
#app .abh-k{margin:0 0 clamp(28px,3vw,48px);font:700 clamp(15px,1.2vw,17.3px)/1.5 var(--en);letter-spacing:.02em;color:#fff}
#app .abh-t{margin:0;font:800 clamp(56px,8.6vw,124px)/1.02 var(--en);letter-spacing:-.055em;color:#f3f3f3}
#app .abh-t em{font-style:normal;color:#fd4533}
#app .abh-l{margin:clamp(40px,5vw,72px) 0 0;font:600 clamp(17px,1.6vw,23px)/1.7 var(--kr);letter-spacing:-.045em;color:#f3f3f3;word-break:keep-all}
#app section:has(> .wrap > .abh) > .wrap > .section-index,#app #approach .section-index,#app #life .section-index{display:none}
#app #org{padding-top:var(--secgap,clamp(120px,12vw,180px)) !important}
#app #org > .wrap .abh{margin-bottom:0}
#app #approach .apr-blk[data-step=intro]{display:block}
#app #approach .apr-bi{max-width:980px;margin:0 auto}
#app .cpx-field{height:clamp(760px,62vw,980px)}
#app .cpx-0{left:2%;top:0}#app .cpx-1{right:4%;top:6%}#app .cpx-2{left:22%;bottom:0}#app .cpx-3{right:14%;bottom:6%}
#app .acx-grid{margin-top:0}
#app .lfx .abh{margin-bottom:clamp(72px,8vw,120px)}
@media (max-width:899px){#app .cpx-field{height:auto}#app .abh-t{font-size:clamp(44px,13vw,64px)}}
@media (max-width:899px){#app .cpx-field .cpx-c{left:auto !important;right:auto !important;top:auto !important;bottom:auto !important}}

/* ── What We Do: 팀 아키텍처 (따로 일하거나, 모두 모여 AX ONE) ── */
#app .arx{max-width:1240px;margin:0 auto}
#app .arx-pick{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin-bottom:clamp(28px,3vw,44px)}
#app .arx-q{width:100%;text-align:center;margin-bottom:6px;font:500 14px/1 var(--kr);color:rgba(255,255,255,.5)}
#app .arx-chip{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:10px;padding:13px 20px;border-radius:999px;border:1px solid rgba(255,255,255,.22);font:700 14px/1 var(--en);letter-spacing:.06em;color:rgba(255,255,255,.75);transition:border-color .35s,background .35s,color .35s}
#app .arx-chip i{width:9px;height:9px;border-radius:3px;border:1px solid rgba(255,255,255,.5);transition:background .3s,border-color .3s}
#app .arx-chip:hover{border-color:rgba(255,255,255,.5);color:#fff}
#app .arx-chip.on{border-color:#fd4533;color:#fff;background:rgba(253,69,51,.12)}
#app .arx-chip.on i{background:#fd4533;border-color:#fd4533}
#app .arx-chip.is-one{margin-left:6px;border-style:dashed}
#app .arx-chip.is-one.on{border-style:solid;background:#fd4533;color:#fff}
#app .arx-chip.is-one.on i{background:#fff;border-color:#fff}
#app .arx-chip:focus-visible{outline:1px solid #fff;outline-offset:3px}
#app .arx-frame{position:relative;border:1px solid transparent;border-radius:22px;padding:0;transition:border-color .7s,padding .7s cubic-bezier(.22,1,.36,1),background .7s,box-shadow .7s}
#app .arx.is-one .arx-frame{border-color:rgba(253,69,51,.55);padding:0 clamp(14px,1.4vw,22px) clamp(14px,1.4vw,22px);background:linear-gradient(180deg,rgba(253,69,51,.06),rgba(253,69,51,0) 40%);box-shadow:0 30px 90px -50px rgba(253,69,51,.45)}
#app .arx-top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;max-height:0;opacity:0;overflow:hidden;transform:translateY(-10px);transition:max-height .7s cubic-bezier(.22,1,.36,1),opacity .5s,transform .7s cubic-bezier(.22,1,.36,1),padding .7s}
#app .arx.is-one .arx-top{max-height:120px;opacity:1;transform:none;padding:20px 6px 18px}
#app .arx-tk{font:700 12px/1 var(--en);letter-spacing:.16em;color:#fd4533}
#app .arx-top b{font:750 clamp(18px,1.6vw,24px)/1.2 var(--kr);letter-spacing:-.03em;color:#fff}
#app .arx-ts{font:400 14px/1.4 var(--kr);color:rgba(255,255,255,.6)}
#app .arx-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,24px);transition:gap .7s cubic-bezier(.22,1,.36,1)}
#app .arx.is-one .arx-cols{gap:0}
#app .arx-c{position:relative;display:flex;flex-direction:column;padding:clamp(24px,2.4vw,34px);border:1px solid rgba(255,255,255,.16);border-radius:18px;background:rgba(14,14,16,.6);transition:opacity .5s,transform .6s cubic-bezier(.22,1,.36,1),border-color .5s,border-radius .7s,background .5s}
#app .arx.has-pick .arx-c:not(.on){opacity:.3;transform:scale(.97)}
#app .arx.has-pick:not(.is-one) .arx-c.on{border-color:#fd4533;background:linear-gradient(180deg,rgba(253,69,51,.08),rgba(14,14,16,.6) 55%)}
#app .arx.is-one .arx-c{border-radius:0;border-color:rgba(255,255,255,.1);background:rgba(14,14,16,.75)}
#app .arx.is-one .arx-c:first-child{border-radius:14px 0 0 14px}
#app .arx.is-one .arx-c:last-child{border-radius:0 14px 14px 0}
#app .arx.is-one .arx-c+.arx-c{border-left-color:rgba(255,255,255,.06)}
#app .arx-ico{width:84px;height:84px;margin:0 0 22px -8px}
#app .arx-k{margin:0 0 8px;font:700 12.5px/1 var(--en);letter-spacing:.16em;color:#fd4533}
#app .arx-c h3{margin:0 0 8px;font:750 clamp(22px,2vw,30px)/1.2 var(--kr);letter-spacing:-.04em;color:#fff}
#app .arx-r{margin:0 0 20px;font:500 15px/1.5 var(--kr);color:rgba(255,255,255,.75)}
#app .arx-c ul{list-style:none;margin:0 0 20px;padding:0;border-top:1px solid rgba(255,255,255,.12)}
#app .arx-c li{padding:11px 0;border-bottom:1px solid rgba(255,255,255,.08);font:400 14.5px/1.4 var(--kr);color:rgba(255,255,255,.82)}
#app .arx-o{margin:0 0 18px;display:flex;align-items:center;gap:10px;font:700 15px/1.3 var(--kr);color:#fff}
#app .arx-o span{font:600 11px/1 var(--en);letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.45);padding:5px 8px;border:1px solid rgba(255,255,255,.2);border-radius:999px}
#app .arx-go{margin-top:auto;font:600 13.5px/1 var(--en);color:rgba(255,255,255,.6);text-decoration:none;transition:color .3s}
#app .arx-go:hover{color:#fd4533}
#app .arx-flow{position:absolute;right:-17px;top:50%;z-index:2;width:34px;height:34px;margin-top:-17px;border-radius:50%;display:grid;place-items:center;background:#fd4533;color:#fff;font-style:normal;opacity:0;transform:scale(.4);transition:opacity .5s .3s,transform .6s cubic-bezier(.22,1.4,.36,1) .3s;box-shadow:0 0 0 6px rgba(253,69,51,.15)}
#app .arx-flow b{font:700 15px/1 var(--en)}
#app .arx.is-one .arx-flow{opacity:1;transform:none}
#app .arx-state{margin:22px 0 0;text-align:center;font:500 15px/1.5 var(--kr);color:rgba(255,255,255,.7);min-height:1.5em}
#app .arx.is-one .arx-state{color:#fff}
@media (max-width:899px){
 #app .arx-cols{grid-template-columns:1fr}#app .arx.is-one .arx-c,#app .arx.is-one .arx-c:first-child,#app .arx.is-one .arx-c:last-child{border-radius:0}
 #app .arx-flow{right:auto;left:50%;top:auto;bottom:-17px;margin:0 0 0 -17px;transform:rotate(90deg) scale(.4)}#app .arx.is-one .arx-flow{transform:rotate(90deg)}
 #app .arx-top{grid-template-columns:1fr;gap:6px}#app .arx.is-one .arx-top{max-height:200px}
 #app .arx-chip{padding:11px 14px;font-size:12.5px}#app .arx-chip.is-one{margin-left:0}
}

/* ── 타이포 체계 정리: 큰 제목(124) > 장면 단어(96) > 문장 제목(40) > 본문(17) > 라벨(13) ── */
#app #approach{padding-bottom:0 !important}
#app #approach .apr-bi{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,48px);max-width:1040px;margin:0 auto;padding-top:28px}
#app #approach .apr-bi p{font-size:16px;line-height:1.8}
#app .hw-pin{height:320vh}
#app .hw-ttl{margin:0 0 clamp(24px,3vh,40px);font:700 13px/1 var(--en);letter-spacing:.16em;text-transform:uppercase;color:#fd4533}
#app .hw-words li{font:800 clamp(56px,6.4vw,100px)/1.04 var(--en) !important;letter-spacing:-.05em !important;-webkit-text-stroke:1px rgba(255,255,255,.3) !important;padding-bottom:.04em}
#app .hw-words li.on{transform:translateX(clamp(10px,1.2vw,20px))}
#app .hw-words li i{height:2px;bottom:.02em}
#app .hw-big{display:none}
#app .hw-copy{min-height:220px}
#app .hw-n{margin-bottom:16px;font-size:13px;letter-spacing:.14em}
#app .hw-c h3{font:750 clamp(28px,2.6vw,40px)/1.25 var(--kr) !important;letter-spacing:-.045em;margin-bottom:16px}
#app .hw-c p:last-child{font-size:17px !important;line-height:1.8 !important;color:rgba(255,255,255,.75) !important}
#app .hw-stick::before{opacity:.8}
/* Our Story 흐름(Before · With AX · Now): 세 칸 같은 크기 · 같은 체계 */
#app #about .ow{grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr) 72px minmax(0,1fr) !important;align-items:stretch !important;max-width:1180px !important}
#app #about .ow-node{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center !important;padding:clamp(30px,3vw,44px) clamp(18px,2vw,28px) !important;border-radius:20px;border:1px solid transparent;min-height:clamp(210px,17vw,250px)}
#app #about .ow-node.is-now{border-color:rgba(253,69,51,.35) !important}
#app #about .ow-k{margin:0 0 18px !important;font:700 13px/1 var(--en) !important;letter-spacing:.16em !important}
#app #about .ow-w{margin:0 !important;font:800 clamp(28px,2.6vw,40px)/1.2 var(--kr) !important;letter-spacing:-.045em !important}
#app #about .ow-node.is-now .ow-w{font-family:var(--en) !important;letter-spacing:-.03em !important}
#app #about .ow-t{margin:16px auto 0 !important;max-width:22ch !important;font:400 16px/1.65 var(--kr) !important;color:rgba(255,255,255,.62) !important}
#app #about .ow-node.is-now .ow-t{color:rgba(255,255,255,.8) !important}
#app #about .ow-ar{align-self:center}
@media (max-width:899px){#app #approach .apr-bi{grid-template-columns:1fr}#app #about .ow{grid-template-columns:1fr !important}#app #about .ow-node{min-height:0}}

/* ── 최상단 브랜드: Our Story 형식(머리말 · 큰 제목 · 두 줄) 아래 석판 장면 ── */
#app #brand .about2.about2-brand{display:flex !important;flex-direction:column;align-items:center;text-align:center;grid-template-columns:none !important;gap:0 !important;position:relative}
#app #brand .brand-head{width:100%}
#app #brand .brand-head .abh{margin-bottom:clamp(8px,1vw,16px)}
#app #brand .brand-visual{width:min(1060px,100%);margin:0 auto;position:relative}
#app #brand .brand-note{max-width:760px;margin:clamp(8px,1vw,16px) auto 0;font:400 16px/1.8 var(--kr);color:rgba(255,255,255,.62);word-break:keep-all}
#app #brand .brand-replay{position:absolute;right:0;bottom:0}
#app #brand > .wrap > .section-index{display:none}

/* 브랜드 제목의 On: 키컬러 네온 글로우 (기존 Brick+On 로고 결) */
/* On: 첨부 레퍼런스의 블룸 — 글자 가장자리에서 넓게 번지는 키컬러 빛 */
#app #brand .abh-t .neon-on{color:#f3f3f3;-webkit-text-fill-color:#f3f3f3;text-shadow:0 0 24px rgba(253,69,51,.62),0 0 58px rgba(253,69,51,.34);transition:text-shadow 1.2s ease}

/* ── 최상단 제목 인터랙션: We Went Wider 결 (단어별 등장) ── */
#app #brand .abh-t .bo-w{display:inline-block;opacity:0;transform:translateY(.45em) skewY(7deg);transition:transform 1s cubic-bezier(.2,1.25,.3,1),opacity .7s ease}
#app #brand .abh-t .bo-p{display:inline-block;opacity:0;transform:scale(.6);transition:opacity .6s ease .5s,transform .8s cubic-bezier(.2,1.4,.4,1) .5s}
#app #brand .abh-t .bo-brick{transition-delay:.05s}
#app #brand .abh-t .bo-on{transition-delay:.35s}
#app #brand .abh-t .bo-brx{transition-delay:.7s}
#app #brand .abh-t.is-in .bo-w{opacity:1;transform:none}
#app #brand .abh-t.is-in .bo-p{opacity:1;transform:none}
/* On: 처음엔 꺼져 있다가 깜빡이며 불이 켜짐 */
#app #brand .abh-t .neon-on{color:#f3f3f3;-webkit-text-fill-color:#f3f3f3;text-shadow:0 0 24px rgba(253,69,51,.62),0 0 58px rgba(253,69,51,.34);transition:text-shadow 1.2s ease}
#app #brand .abh-t .bo-on:hover .neon-on{text-shadow:0 0 26px rgba(253,69,51,.55),0 0 70px rgba(253,69,51,.28)}
@media (prefers-reduced-motion:reduce){#app #brand .abh-t .bo-w,#app #brand .abh-t .bo-p{opacity:1;transform:none;transition:none}}

/* Plan First → How we work 사이 여백 줄이기 */
#app #approach .apr-blk[data-step=intro]{padding-bottom:0 !important;min-height:0 !important}
#app #approach .apr-flow{padding-bottom:0 !important}
#app #approach{padding-bottom:0 !important;margin-bottom:0 !important}
#app #approach .wrap{padding-bottom:0}
#app .hw-stick{justify-content:flex-start !important;padding-top:clamp(28px,4vh,56px)}
#app .hw-pin{height:300vh}
@media (max-width:899px){#app .hw-stick{padding-top:0}}
#app .arx-top{grid-template-columns:auto}

/* 메인 키비쥬얼(최상단 석판): 파편이 잘리지 않도록 캔버스를 화면 전체 폭으로 */
#app #brand .brand-visual .hero-visual{left:50% !important;width:100vw !important;max-width:none !important;transform:translateX(-50%) !important;overflow:visible !important}
#app #brand .brand-visual #heroCanvas{overflow:visible !important}

/* 미션 · 비전 문장: 두 줄이 각각 미션 · 비전 카드와 짝, 핵심어는 키컬러 */
#app #mission .abh-l{max-width:820px;margin-left:auto;margin-right:auto}
#app #mission .mv-line{display:block;font:600 clamp(18px,1.9vw,26px)/1.6 var(--kr);letter-spacing:-.04em;color:rgba(255,255,255,.72);opacity:0;transform:translateY(12px);transition:opacity .8s ease,transform .9s cubic-bezier(.22,1,.36,1)}
#app #mission .mv-line + .mv-line{transition-delay:.25s}
#app #mission .abh-l.is-in .mv-line,#app #mission .mv-line.in{opacity:1;transform:none}
#app #mission .mv-line b{color:#fff;font-weight:800}
#app #mission .mv-line em{font-style:normal;color:#fd4533;font-weight:700}
#app #mission .mvx-sub{letter-spacing:-.02em}
@media (prefers-reduced-motion:reduce){#app #mission .mv-line{opacity:1;transform:none;transition:none}}

/* 배경 띠 끊김 해결: 빛이 박스 가장자리에서 잘리지 않도록 — 박스 밖으로 자르지 않고, 빛 원은 박스 안에 들어가게 */
#app .hw-stick,#app .ogs-stick,#app .apr-stick,#app .lfx,#app .cpx-field{overflow:visible !important}
#app .hw-stick::before{top:50% !important;transform:translateY(-50%);width:min(44vw,600px) !important;height:min(44vw,600px) !important;right:-2vw !important;background:radial-gradient(closest-side,rgba(253,69,51,.12),rgba(253,69,51,.04) 60%,rgba(253,69,51,0))}
#app .ogs-glow{top:50% !important}

/* 복지 마퀴: 항목마다 3D 아이콘 */
#app .lfx-tr span{display:inline-flex;align-items:center;gap:clamp(12px,1.1vw,18px)}
#app .lfx-ic{width:clamp(64px,6.4vw,100px);height:clamp(64px,6.4vw,100px);margin:calc(clamp(64px,6.4vw,100px) * -.18) 0;object-fit:contain;flex:none;filter:drop-shadow(0 10px 18px rgba(0,0,0,.45))}

/* ── 메인 타이틀 인터랙션 v2: Brick은 파편이 모여 글자가 되고, +는 한 바퀴 돌고, On은 형광등처럼 켜짐 ── */
#app #brand .abh-t .bo-brick{display:inline-block;white-space:nowrap}
#app #brand .abh-t .bl{display:inline-block;font-style:normal;opacity:0;filter:blur(7px);transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(.4);transition:transform 1.5s cubic-bezier(.16,1,.3,1) var(--d),opacity .9s ease var(--d),filter 1.1s ease var(--d)}
#app #brand .abh-t.is-in .bl{opacity:1;filter:none;transform:none}
#app #brand .abh-t .bo-plus{display:inline-block;opacity:0;transform:rotate(-360deg) scale(.5);transition:transform 1.8s cubic-bezier(.2,.9,.3,1) 1.05s,opacity .6s ease 1.05s}
#app #brand .abh-t.is-in .bo-plus{opacity:1;transform:none}
#app #brand .abh-t .bo-on{display:inline-block}
#app #brand .abh-t .neon-on{color:#2e2f33;-webkit-text-fill-color:#2e2f33;text-shadow:none;transition:none}
#app #brand .abh-t.is-in .neon-on{animation:boFluor 1.5s linear 2.2s both}
@keyframes boFluor{
 0%{color:#2e2f33;-webkit-text-fill-color:#2e2f33;text-shadow:none}
 8%{color:#f3f3f3;-webkit-text-fill-color:#f3f3f3;text-shadow:0 0 24px rgba(253,69,51,.62),0 0 58px rgba(253,69,51,.34)}
 12%{color:#2e2f33;-webkit-text-fill-color:#2e2f33;text-shadow:none}
 18%{color:#f3f3f3;-webkit-text-fill-color:#f3f3f3;text-shadow:0 0 24px rgba(253,69,51,.62),0 0 58px rgba(253,69,51,.34)}
 24%{color:#2e2f33;-webkit-text-fill-color:#2e2f33;text-shadow:none}
 30%{color:#f3f3f3;-webkit-text-fill-color:#f3f3f3;text-shadow:0 0 24px rgba(253,69,51,.62),0 0 58px rgba(253,69,51,.34)}
 100%{color:#f3f3f3;-webkit-text-fill-color:#f3f3f3;text-shadow:0 0 24px rgba(253,69,51,.62),0 0 58px rgba(253,69,51,.34)}
}
@media (prefers-reduced-motion:reduce){#app #brand .abh-t .bl,#app #brand .abh-t .bo-plus{opacity:1;transform:none;filter:none;transition:none}#app #brand .abh-t.is-in .neon-on{animation:none;color:#f3f3f3;-webkit-text-fill-color:#f3f3f3;text-shadow:0 0 24px rgba(253,69,51,.62),0 0 58px rgba(253,69,51,.34)}}

/* 복지 아이콘 위아래 잘림 해소: 음수 여백 제거 + 흐름 영역에 위아래 여유 */
#app .lfx-ic{margin:0 !important;width:clamp(60px,5.6vw,88px) !important;height:clamp(60px,5.6vw,88px) !important}
#app .lfx-mq{padding-block:8px}
#app .lfx-ben{gap:clamp(4px,.6vw,10px) !important}
#app #brand .brand-note{max-width:940px}
#app #about .quit + div .fill{max-width:1100px !important;margin-left:auto;margin-right:auto}
#app #about .ow-t{max-width:none !important}

/* 조직 판넬과 글자 겹침 해소: 주석을 바깥으로, 판을 조금 작게, 층 간격 넓게 */
@media (min-width:900px){
 #app .ogs-stage{height:min(72vh,700px)}
 #app .ogs-pl{left:calc(clamp(200px,17vw,280px) / -2) !important;top:calc(clamp(200px,17vw,280px) / -2) !important;width:clamp(200px,17vw,280px) !important;transform:translateZ(calc(var(--i) * (14px + var(--e) * 112px))) !important}
 #app .ogs-pl.on{transform:translateZ(calc(var(--i) * (14px + var(--e) * 112px) + 18px)) !important}
 #app .ogs-n:not(.is-r) .ogs-tx{right:calc(70% + 22px) !important;width:min(27%,340px) !important}
 #app .ogs-n.is-r .ogs-tx{left:calc(70% + 22px) !important;width:min(27%,340px) !important}
 #app .ogs-n:not(.on) .ogs-tx ul{max-height:0 !important;margin-top:0 !important}
}

/* About BRIXON 소개 문단: 흰 글자 · 키워드 볼드 · 스크롤에 따라 단어가 켜지는 타이포 */
#app #brand .brand-note{max-width:1100px !important;margin-top:clamp(16px,2vw,32px) !important}
#app #brand .brand-note .fill{margin:0;font:500 clamp(19px,1.9vw,28px)/1.7 var(--kr) !important;letter-spacing:-.04em;color:#f3f3f3;text-align:center;word-break:keep-all}
#app #brand .brand-note .fill .w.hot{font-weight:800;color:#fff}
#app #brand .brand-note .fill{max-width:none !important;width:auto !important}

/* How we work 단어 채움: 마지막 글자 끝까지 칠해지도록 채움 영역을 글자 밖까지 확장 */
#app .hw-words li{padding-right:.16em !important;margin-right:-.16em}
#app .hw-words li i{right:.16em}

/* How we work 설명 박스: 더 넓게, 왼쪽으로 */
@media (min-width:900px){
 #app .hw-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) !important;gap:clamp(24px,3vw,56px) !important}
 #app .hw-copy{max-width:640px;padding-left:32px}
 #app .hw-c{left:32px !important;right:0}
}

/* ── 조직도 인터랙션 고도화 ── */
@media (min-width:900px){
 /* 커서를 따라 판 더미가 살짝 기울어짐 */
 #app .ogs-stk{transform:rotateX(calc(60deg + var(--ty,0) * 8deg)) rotateZ(calc(-40deg + var(--tx,0) * 10deg)) translateZ(calc(-80px - var(--e) * 120px)) !important}
 /* 전략기획에서 맨 위 판까지 관통하는 데이터 빔 */
 #app .ogs-beam{position:absolute;left:-1px;top:0;width:2px;height:calc(3 * (14px + var(--e) * 112px) + 24px);transform-origin:50% 0;transform:rotateX(90deg);background:linear-gradient(180deg,rgba(253,69,51,.55),rgba(253,69,51,.15));opacity:calc(var(--e) * .9);pointer-events:none}
 #app .ogs-beam b{position:absolute;left:-3px;width:8px;height:22%;border-radius:4px;background:linear-gradient(180deg,rgba(253,69,51,0),rgba(255,140,120,.95),rgba(253,69,51,0));filter:blur(.5px);animation:ogsPulse 2.8s cubic-bezier(.45,0,.2,1) infinite}
 #app .ogs-beam b+b{animation-delay:1.4s}
 @keyframes ogsPulse{0%{top:-22%;opacity:0}15%{opacity:1}85%{opacity:1}100%{top:100%;opacity:0}}
 /* 주석: 글자에 손이 가면 그 층이 떠오름, 선은 판에서 라벨 쪽으로 그려짐 */
 #app .ogs-tx{pointer-events:auto;cursor:pointer}
 #app .ogs-line{transform:scaleX(0);transition:transform .9s cubic-bezier(.22,1,.36,1),background .4s}
 #app .ogs-n.is-r .ogs-line{transform-origin:0 50%}
 #app .ogs-n:not(.is-r) .ogs-line{transform-origin:100% 50%}
 #app .ogs-n.lit .ogs-line,#app .ogs-n.on .ogs-line{transform:scaleX(1)}
 #app .ogs-tx h3{transition:color .4s,transform .5s cubic-bezier(.22,1,.36,1)}
 #app .ogs-n.on .ogs-tx h3{color:#fff}
 #app .ogs-n:not(.is-r).on .ogs-tx h3{transform:translateX(-6px)}
 #app .ogs-n.is-r.on .ogs-tx h3{transform:translateX(6px)}
 /* 지금 층: 테두리를 따라 빛이 한 바퀴 지나감 */
 #app .ogs-pl.on::after{content:"";position:absolute;inset:-1px;border-radius:10px;padding:1px;background:conic-gradient(from var(--ang,0deg),transparent 0 70%,rgba(255,160,140,.95) 82%,transparent 94%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:ogsSweep 3.2s linear infinite}
 @property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
 @keyframes ogsSweep{to{--ang:360deg}}
}
@media (prefers-reduced-motion:reduce){#app .ogs-beam b,#app .ogs-pl.on::after{animation:none}}

/* What We Do 카드 CTA: 눈에 띄는 버튼 */
#app .arx-go{display:inline-flex;align-items:center;justify-content:space-between;gap:14px;align-self:stretch;margin-top:auto;padding:15px 20px 15px 22px;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.05);font:700 14.5px/1 var(--kr) !important;letter-spacing:-.01em;color:#fff !important;text-decoration:none;transition:background .35s,border-color .35s,box-shadow .35s,transform .35s cubic-bezier(.22,1,.36,1)}
#app .arx-go span{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fff;color:#0b0b0d;font:700 14px/1 var(--en);transition:transform .45s cubic-bezier(.22,1,.36,1),background .35s,color .35s}
#app .arx-go:hover{background:#fd4533;border-color:#fd4533;box-shadow:0 14px 34px -14px rgba(253,69,51,.75);transform:translateY(-2px)}
#app .arx-go:hover span{transform:translateX(4px) rotate(-45deg)}
#app .arx.has-pick:not(.is-one) .arx-c.on .arx-go,#app .arx.is-one .arx-go{background:#fd4533;border-color:#fd4533;box-shadow:0 12px 30px -16px rgba(253,69,51,.7)}
#app .arx-go:focus-visible{outline:2px solid #fff;outline-offset:3px}

/* Life 숫자(40h · 90min · 3days) 더 볼드하게 */
#app .lfx-stats b{font-weight:800 !important;letter-spacing:-.05em !important}
#app .lfx-stats b .lf-cnt{font-weight:800 !important}
#app .lfx-stats b small{font-weight:700 !important}

/* ── About BRIXON 소개: 문장 + 인터랙션 (역할 단어 교체 · 접점 칩 순차 점등 · 밑줄) ── */
#app #brand .bn2{max-width:1100px !important;margin:clamp(20px,2.4vw,40px) auto 0 !important;text-align:center}
#app #brand .bn2 p{margin:0;letter-spacing:-.04em;color:#f3f3f3;word-break:keep-all}
#app #brand .bn2-l1{font:500 clamp(20px,2vw,30px)/1.5 var(--kr)}
#app #brand .bn2-rot{display:inline-grid;vertical-align:bottom;overflow:hidden;text-align:left}
#app #brand .bn2-rot b{grid-area:1/1;font-weight:800;color:#fff;transform:translateY(105%);opacity:0;transition:transform .7s cubic-bezier(.22,1,.36,1),opacity .5s}
#app #brand .bn2-rot b.on{transform:none;opacity:1}
#app #brand .bn2-rot b.out{transform:translateY(-105%);opacity:0}
#app #brand .bn2-l2{margin-top:clamp(18px,2vw,28px) !important;font:500 clamp(16px,1.3vw,19px)/1.5 var(--kr);color:rgba(255,255,255,.62) !important}
#app #brand .bn2-flow{list-style:none;margin:clamp(14px,1.6vw,22px) 0;padding:0;display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:wrap}
#app #brand .bn2-flow li{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font:700 clamp(16px,1.4vw,21px)/1 var(--kr);letter-spacing:-.03em;color:rgba(255,255,255,.55);opacity:0;transform:translateY(10px);transition:opacity .6s ease calc(.25s + var(--n) * .45s),transform .7s cubic-bezier(.22,1,.36,1) calc(.25s + var(--n) * .45s),color .5s ease calc(.45s + var(--n) * .45s),border-color .5s ease calc(.45s + var(--n) * .45s)}
#app #brand .bn2-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.3);transition:background .5s ease calc(.45s + var(--n) * .45s),box-shadow .5s ease calc(.45s + var(--n) * .45s)}
#app #brand .bn2.is-in .bn2-flow li{opacity:1;transform:none;color:#fff;border-color:rgba(253,69,51,.45)}
#app #brand .bn2.is-in .bn2-dot{background:#fd4533;box-shadow:0 0 0 4px rgba(253,69,51,.18)}
#app #brand .bn2-flow li:hover{border-color:#fd4533;background:rgba(253,69,51,.12)}
#app #brand .bn2-link{display:block;width:clamp(24px,3vw,48px);height:1px;background:rgba(253,69,51,.7);transform:scaleX(0);transform-origin:0 50%}
#app #brand .bn2-link:nth-of-type(1){transition:transform .5s cubic-bezier(.22,1,.36,1) .55s}
#app #brand .bn2-link:nth-of-type(2){transition:transform .5s cubic-bezier(.22,1,.36,1) 1s}
#app #brand .bn2.is-in .bn2-link{transform:none}
#app #brand .bn2-l3{font:500 clamp(20px,2vw,30px)/1.5 var(--kr)}
#app #brand .bn2-l3 em{position:relative;font-style:normal;font-weight:800;color:#fff;font-family:var(--en)}
#app #brand .bn2-l3 em::after{content:"";position:absolute;left:0;right:0;bottom:-.08em;height:3px;border-radius:2px;background:#fd4533;transform:scaleX(0);transform-origin:0 50%;transition:transform .8s cubic-bezier(.22,1,.36,1) 1.5s}
#app #brand .bn2.is-in .bn2-l3 em::after{transform:none}
@media (max-width:700px){#app #brand .bn2-flow{flex-direction:column;gap:8px}#app #brand .bn2-link{width:1px;height:14px;transform-origin:50% 0}}
@media (prefers-reduced-motion:reduce){#app #brand .bn2-flow li,#app #brand .bn2-link,#app #brand .bn2-l3 em::after{transition:none}}

/* How we work 단어: 아래 획(g 등)까지 채워지도록 채움 영역을 위아래로도 확장, 주황 밑줄 제거 */
#app .hw-words li{padding:.04em .18em .24em 0 !important;margin:0 -.18em -.2em 0 !important;line-height:1.02 !important}
#app .hw-words li i{display:none !important}
@property --f{syntax:'<percentage>';inherits:false;initial-value:0%}
#app .hw-words li{transition:--f .75s cubic-bezier(.4,0,.2,1),-webkit-text-stroke-color .6s,transform .8s cubic-bezier(.22,1,.36,1) !important}

/* 전체 페이지: 볼드가 섞인 설명 문장은 일반 글씨를 가늘게(300) — 볼드가 또렷하게 강조되도록 */
#app :is(p,li,dd,.ow-t,.bn2-l1,.bn2-l3):has(:is(b,strong,.w.hot,em)):not(.abh-t):not(.mvx-k):not(.hw-n):not(.cc-num):not(.apr-no){font-weight:300 !important}
#app :is(p,li,dd,.ow-t,.bn2-l1,.bn2-l3):has(:is(b,strong,.w.hot,em)):not(.abh-t):not(.mvx-k):not(.hw-n) :is(b,strong,.w.hot){font-weight:800 !important;color:#fff}
#app .fill:has(.w.hot) .w:not(.hot){font-weight:300 !important}
#app .bn2-l3 em,#app .bn2-rot b{font-weight:800 !important}

/* 최상단 석판을 다시 화면 정중앙에 — 석판은 그림 폭의 약 73% 지점에 있어서, 그 지점을 화면 중앙에 맞추고 캔버스는 화면 양끝을 덮도록 넓게 */
#app #brand .brand-visual .hero-visual{width:190vw !important;left:calc(50% - 190vw * .732) !important;transform:none !important}
#app #brand .brand-visual .hero-visual{width:200vw !important;left:calc(50vw - var(--bvx,118px) - 200vw * .732) !important}
/* 석판 원래 크기 · 정중앙으로 복원, 파편은 캔버스 오른쪽 끝에서 잘리지 않고 부드럽게 사라지게 */
#app #brand .brand-visual .hero-visual{left:-75% !important;width:180% !important;transform:none !important;overflow:visible !important}
#app #brand .brand-visual #heroCanvas{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 80%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 80%,transparent 100%)}

/* Partnership 모델 카드: 설명 2줄 고정 → 핵심 제공 범위 시작 높이를 세 카드 모두 일직선으로 */
#app .pm3-for{min-height:calc(1.7em * 2 + 30px);word-break:keep-all}
#app .pm3-for br{display:block}
@media (max-width:1100px){#app .pm3-for{min-height:0}#app .pm3-for br{display:none}}
@media (min-width:1360px){#app .ct-lead span{white-space:nowrap}}

@media(min-width:821px){#app .pk-head{flex-wrap:nowrap}#app .pk-head .pk-h{flex:0 1 auto}#app .pk-head .pk-s{flex:0 0 auto;text-align:right}}

#app .transform-row .to-copy{color:rgba(255,255,255,.66) !important;font-weight:400 !important}
#app .transform-row .to-copy b{color:#fd4533;font-weight:800}
@media(min-width:1101px){#app #edge>.wrap>.hl{grid-template-columns:max-content minmax(0,1fr)}#app #edge>.wrap>.hl .kc{max-width:none;justify-self:end}#app #edge>.wrap>.hl .kc :is(b,p){white-space:nowrap}}
@media(min-width:1101px){#app #services .venn.vf-wrap{grid-template-columns:minmax(0,1.7fr) auto minmax(0,1fr)}#app #services .vf{flex-wrap:nowrap;justify-content:space-between}#app #services .vf-term b{font-size:clamp(24px,2.1vw,32px)}
#app .hl:has(+ .sv-step){grid-template-columns:minmax(0,1fr) minmax(0,600px)}#app .hl:has(+ .sv-step) .kc{max-width:none}#app #services .vf-term small{white-space:nowrap}}
#app .hl .kc p strong{font-weight:800;color:#fff}
@media(min-width:1101px){#app .hl:has(.kc p br){grid-template-columns:minmax(0,1fr) minmax(0,max-content)}#app .hl:has(.kc p br) .kc{max-width:none}}
@media(min-width:1101px) and (max-width:1239px){#app .hl:has(.kc p br){grid-template-columns:minmax(0,1fr) minmax(0,560px)}}
@media(min-width:1240px){#app .hl:has(.kc p br) .kc p{white-space:nowrap}}
#app .dg-terms{flex-direction:column;gap:9px}
#app #brand .bn2{margin-top:clamp(64px,7vw,128px) !important}
#app #brand .bn2-l1{font-size:clamp(25px,2.9vw,44px);line-height:1.4;letter-spacing:-.04em;margin-bottom:clamp(8px,1vw,16px)}
@media(max-width:600px){#app #brand .bn2-l1{font-size:21px}#app #brand .bn2-rot{display:grid;justify-content:center;text-align:center;font-size:26px;margin-top:4px}}
#app .ow-slogan .fill,#app .ow-slogan .fill *{text-wrap:balance}
#app #about .ts-lab,#app #about .ts-lab b{color:#fff !important}
#app #about .ts{max-width:none;width:100vw;margin-left:calc(50% - 50vw);margin-right:0}
#app #about .ts-lab{padding-inline:max(24px,calc(50vw - 648px))}
#app #about .ts-row{-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
/* 숫자 인덱스 통일(.nx): 메인 첫 화면 hero-proof와 같은 스타일 · 슬롯 숫자 · 호버(빛 · 떠오름 · 단위 키컬러) */
#app .nx{display:grid;grid-template-columns:repeat(var(--c,4),minmax(0,1fr));gap:0 clamp(20px,3vw,56px);text-align:left;border:0;padding:0;margin:0}
#app .nx>div{position:relative;isolation:isolate;cursor:default;border:0;padding:0;background:none}
#app .nx>div::before{content:"";position:absolute;left:calc(clamp(40px,4vw,70px) - clamp(130px,11vw,160px));top:calc(clamp(30px,3vw,50px) - clamp(130px,11vw,160px));width:clamp(260px,22vw,320px);aspect-ratio:1;border-radius:50%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(253,69,51,.3),rgba(253,69,51,.1) 50%,rgba(253,69,51,0) 100%);opacity:0;transform:scale(.7);transition:opacity .7s ease,transform 1s cubic-bezier(.22,1,.36,1)}
#app .nx>div:hover::before{opacity:1;transform:none}
#app .nx>div>b{--big:clamp(60px,6.8vw,116px);display:flex;align-items:flex-start;gap:.06em;margin:0;font:800 var(--big)/1 var(--en);letter-spacing:-.05em;color:#fff;-webkit-text-fill-color:#fff;background:none;text-shadow:none;white-space:nowrap;transition:transform .8s cubic-bezier(.22,1,.36,1)}
#app .nx>div:hover>b{transform:translateY(-4px)}
#app .nx .odo{display:inline-flex;line-height:1;height:1em;overflow:hidden;vertical-align:baseline;color:#fff}
#app .nx .odo-c{display:block;height:1em;overflow:hidden}
#app .nx .odo-s{display:flex;flex-direction:column;transform:translateY(0);will-change:transform}
#app .nx .odo-s i{display:block;height:1em;line-height:1;font-style:normal;text-align:center}
#app .nx.go .odo-s{transform:translateY(calc(var(--n) * -1em));transition:transform calc(1.6s + var(--j) * .25s) cubic-bezier(.16,1,.3,1) calc(var(--i) * .14s + var(--j) * .08s)}
#app .nx>div>b small{margin:calc(var(--big) * .1) 0 0 .04em;font:400 .26em/1 var(--en);letter-spacing:.01em;color:#fff;text-transform:none;opacity:0;transform:translateY(.4em) scale(.8);transition:opacity .5s ease,transform .7s cubic-bezier(.34,1.56,.64,1),color .5s ease;transition-delay:calc(var(--i) * .14s + 1.2s),calc(var(--i) * .14s + 1.2s),0s}
#app .nx>div>b small.hp-pre{order:-1;margin:calc(var(--big) * .1) .04em 0 0;font-weight:500;letter-spacing:-.05em}
#app .nx.go>div>b small{opacity:1;transform:none}
#app .nx>div:hover>b small{color:#fd4533}
#app .nx>div>span{display:block;margin-top:22px;font:500 15px/1.4 var(--kr);color:#fff;opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .8s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--i) * .14s + .5s)}
#app .nx.go>div>span{opacity:.92;transform:none}
#app .nx .nx-sub{display:block;margin-top:8px;font:500 13px/1.4 var(--kr);font-style:normal;color:rgba(255,255,255,.5)}
#app .nx-crew .nx-sub{font:700 11px/1.4 var(--en);letter-spacing:.14em;text-transform:uppercase;color:#fd4533}
#app .nx-cert{--c:1}
#app .nx-cert>div>span{margin-top:14px}
@media (max-width:820px){#app .nx{grid-template-columns:1fr 1fr;row-gap:36px}#app .nx-cert{grid-template-columns:1fr}#app .nx>div>b{--big:clamp(52px,14vw,72px)}#app .nx>div>span{font-size:13.5px;margin-top:14px}}
@media (prefers-reduced-motion:reduce){#app .nx .odo-s{transform:translateY(calc(var(--n) * -1em)) !important;transition:none !important}#app .nx>div>b small,#app .nx>div>span{opacity:1 !important;transform:none !important}}
#app .story-nx{width:min(100% - 48px,960px);margin:32px auto 0}
#app .story-nx .nx>div>b{--big:clamp(52px,5vw,84px)}
#app .story-nx .nx>div>span{margin-top:16px;font-size:14px}
@media (min-width:821px){#app .story-nx{position:absolute;left:0;right:0;top:calc(50% - 6vh + clamp(48px,6vw,92px) * 1.5 + 18px + 63px + clamp(36px,4vh,52px));margin:0 auto;z-index:2}}
#app .story-nx>p{margin:28px 0 0;text-align:center;font:400 12px/1.6 var(--kr);color:rgba(255,255,255,.4)}
#app .nx-life{margin-top:clamp(40px,4vw,64px);padding-bottom:clamp(40px,4vw,64px)}
#app #about .nx.nx-crew{margin-top:clamp(64px,7vw,112px) !important}
#app #about .section-index{display:none}
/* 진단 대화 카드(흰 카드) 가독성: 전역 굵기 규칙(본문 300 · 굵은 글씨 흰색)이 흰 카드에선 안 보여서 따로 */
#app .cvx .cvx-bot p,#app .cvx .cvx-bot p:has(b){background:#ebebef !important;color:#141416 !important;font-weight:400 !important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}
#app .cvx .cvx-bot p b,#app .cvx .cvx-bot p strong{color:#e8392a !important;font-weight:800 !important}
#app .cvx .cvx-pill{background:#f4f4f6 !important;color:#141416 !important;font-weight:600 !important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.16) !important;border-color:transparent !important;transition:background .25s,color .25s,box-shadow .25s}
#app .cvx .cvx-pill:hover,#app .cvx .cvx-pill:focus-visible{background:#141416 !important;color:#fff !important;box-shadow:none !important}
#app .lfx-ben .lfx-ic,#app .lfx-ben .lfx-ic:hover{filter:none !important;box-shadow:none !important}
#app .lfx-ben .lfx-tr,#app .lfx-ben .lfx-tr *{text-shadow:none !important;filter:none !important;-webkit-text-stroke:0 !important}
@media(min-width:821px){#app .hsx{grid-template-columns:repeat(4,auto) !important;justify-content:space-between !important;column-gap:clamp(24px,3vw,48px) !important}}
/* 빈 구간 정리: 고정 장면이 끝난 뒤 남던 빈 화면 줄이기 */
@media(min-width:900px){#app #approach .hw-pin{margin-bottom:min(0px,calc(600px - 100vh))}#app #org{padding-bottom:0 !important}}
@media(min-width:821px){#app #edge{padding-bottom:clamp(24px,3vw,48px) !important}#app #edge .transform-stage{padding-bottom:0 !important}}
#app .pk-h:has(b){font-weight:300 !important;line-height:1.22}
#app .pk-h b{font-weight:800;color:#fff}
@media(min-width:821px){#app .pk-head:has(.pk-h b){align-items:flex-end}}
/* Partnership 모델 카드 고도화(pm4): 번호 인덱스 · 관여 깊이 막대 · 구획선 · 체크 리스트 */
#app .pm4-card{padding:clamp(28px,2.6vw,40px) !important;gap:0}
#app .pm4-top{display:flex;align-items:flex-start;justify-content:space-between}
#app .pm4-num{font:800 clamp(56px,5vw,84px)/.8 var(--en);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.16);transition:color .6s ease,-webkit-text-stroke-color .6s ease;margin:-6px -4px 0 0}
#app .pm4-card:hover .pm4-num,#app .pm4-card.is-key .pm4-num{-webkit-text-stroke-color:rgba(253,69,51,.7)}
#app .pm4-card:hover .pm4-num{color:rgba(253,69,51,.12)}
#app .pm4-card .pm3-name{margin:6px 0 0 !important}
#app .pm4-type{display:inline-flex;align-items:center;gap:8px;margin-top:12px !important;font:700 clamp(14px,1.1vw,16px)/1 var(--kr) !important;color:#fff !important}
#app .pm4-type::before{content:"";width:18px;height:2px;border-radius:2px;background:#fd4533}
#app .pm4-depth{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-top:26px;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
#app .pm4-card .pm4-depth small{margin:0 !important;font:700 11px/1 var(--kr) !important;letter-spacing:.04em;color:rgba(255,255,255,.55) !important}
#app .pm4-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
#app .pm4-bar i{height:4px;border-radius:4px;background:rgba(255,255,255,.12);overflow:hidden;position:relative}
#app .pm4-bar i.on::after{content:"";position:absolute;inset:0;background:#fd4533;transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.22,1,.36,1)}
#app .pm4-card.in .pm4-bar i.on::after,#app .pm4-card.rv.on .pm4-bar i.on::after,#app .pm4-card:hover .pm4-bar i.on::after{transform:none}
#app .pm4-bar i.on:nth-child(2)::after{transition-delay:.15s}#app .pm4-bar i.on:nth-child(3)::after{transition-delay:.3s}
#app .pm4-depth b{font:700 13px/1 var(--kr);color:#fff;white-space:nowrap}
#app .pm4-sec{margin-top:24px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08)}
#app .pm4-card .pm4-sec small{display:flex;align-items:center;gap:8px;margin:0 0 12px !important;font:700 11.5px/1 var(--kr) !important;letter-spacing:.06em;color:rgba(255,255,255,.55) !important;text-transform:none}
#app .pm4-card .pm4-sec small::before{content:"";width:5px;height:5px;border-radius:50%;background:#fd4533}
#app .pm4-card .pm3-for{margin:0 !important;min-height:calc(1.65em * 2);font:400 15px/1.65 var(--kr) !important;color:rgba(255,255,255,.82) !important}
#app .pm4-del ul{display:block !important}
#app .pm4-del li{display:flex !important;align-items:center;gap:12px;padding:12px 0 !important;border-radius:0 !important;background:none !important;box-shadow:none !important;border-bottom:1px solid rgba(255,255,255,.06);font:600 15px/1.35 var(--kr) !important;color:#fff !important;transition:padding .4s ease,color .4s ease}
#app .pm4-del li:last-child{border-bottom:0}
#app .pm4-del li::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;background:rgba(253,69,51,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' fill='none' stroke='%23fd4533' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
#app .pm4-del li:hover{padding-left:6px !important;background:none !important}
#app .pm4-card.is-key .pm4-del li:first-child{background:none !important;box-shadow:none !important;color:#fff !important}
#app .pm4-card.is-key .pm4-del li::before{background-color:#fd4533;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
@media (max-width:1100px){#app .pm4-card .pm3-for{min-height:0}}
/* 서비스 상세(pv2) 고도화: 카드 나열 → 인덱스 행, 지표 박스 → 헤어라인 인덱스, 벽 목록 호버 */
#app .pv4-wd{display:block !important;border-top:1px solid rgba(255,255,255,.14)}
#app .pv4-wd article{display:grid !important;grid-template-columns:80px minmax(0,1fr) minmax(0,1.15fr) 40px;align-items:center;gap:clamp(16px,2.4vw,40px);padding:clamp(28px,3vw,44px) 8px !important;border-radius:0 !important;background:none !important;box-shadow:none !important;border-bottom:1px solid rgba(255,255,255,.1);position:relative;isolation:isolate;transition:padding .5s cubic-bezier(.22,1,.36,1)}
#app .pv4-wd article::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 140% at 20% 50%,rgba(253,69,51,.14),rgba(253,69,51,0) 70%);opacity:0;transition:opacity .6s ease}
#app .pv4-wd article:hover{padding-left:24px !important}
#app .pv4-wd article:hover::before{opacity:1}
#app .pv4-wd .h{margin:0 !important;font:800 clamp(26px,2.4vw,36px)/1 var(--en) !important;letter-spacing:-.04em !important}
#app .pv4-wd .h em{color:transparent !important;-webkit-text-stroke:1px rgba(255,255,255,.3);transition:color .5s,-webkit-text-stroke-color .5s}
#app .pv4-wd article:hover .h em{color:#fd4533 !important;-webkit-text-stroke-color:#fd4533}
#app .pv4-wd h4{margin:0 !important;font:800 clamp(22px,2vw,30px)/1.3 var(--kr) !important;letter-spacing:-.04em !important;color:#fff}
#app .pv4-wd article>p:not(.h){margin:0 !important;font:400 clamp(14.5px,1.05vw,16px)/1.65 var(--kr) !important;color:rgba(255,255,255,.66) !important}
#app .pv4-ar{justify-self:end;font:400 22px/1 var(--en);color:rgba(255,255,255,.35);transition:transform .5s cubic-bezier(.22,1,.36,1),color .4s}
#app .pv4-wd article:hover .pv4-ar{color:#fd4533;transform:translate(3px,-3px)}
@media (max-width:820px){#app .pv4-wd article{grid-template-columns:48px 1fr;gap:10px 14px}#app .pv4-wd article>p:not(.h){grid-column:2}#app .pv4-ar{display:none}}
#app .pv4-kpi{gap:0 clamp(20px,3vw,56px) !important;border-top:1px solid rgba(255,255,255,.14)}
#app .pv4-kpi>div{padding:clamp(24px,2.4vw,32px) 0 0 !important;border-radius:0 !important;background:none !important;box-shadow:none !important;position:relative}
#app .pv4-kpi>div::before{content:"";position:absolute;left:0;top:-1px;height:2px;width:0;background:#fd4533;transition:width 1.1s cubic-bezier(.22,1,.36,1)}
#app .pv4-kpi>div.in::before{width:48px}
#app .pv4-kpi small{display:flex !important;align-items:center;gap:10px;color:rgba(255,255,255,.55) !important;font:700 11.5px/1 var(--kr) !important;letter-spacing:.06em !important}
#app .pv4-kpi small i{font:800 11.5px/1 var(--en);font-style:normal;color:#fd4533;letter-spacing:.1em}
#app .pv4-kpi b{margin-top:14px !important;font-size:clamp(26px,2.4vw,36px) !important}
#app .pv2-wall{position:relative;isolation:isolate;transition:padding .5s cubic-bezier(.22,1,.36,1)}
#app .pv2-wall::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(253,69,51,.12),rgba(253,69,51,0) 60%);opacity:0;transition:opacity .5s ease}
#app .pv2-wall:hover{padding-left:16px}
#app .pv2-wall:hover::before{opacity:1}
#app .pv2-wall:hover .t{box-shadow:inset 0 0 0 1px rgba(253,69,51,.6);color:#fff}
#app .ct-lead span{color:rgba(255,255,255,.4) !important}
/* 진단 대화 카드 2차: 말풍선 = 진한 회색 바탕 · 흰 글씨 · 외곽선 없음 / 선택지 = 흰 버튼 · 진한 테두리 */
#app .cvx .cvx-bot p,#app .cvx .cvx-bot p:has(b){background:#2b2b30 !important;color:#fff !important;box-shadow:none !important;border:0 !important}
#app .cvx .cvx-bot p b,#app .cvx .cvx-bot p strong{color:#ff6a58 !important}
#app .cvx .cvx-pill{background:#fff !important;color:#141416 !important;font-weight:700 !important;box-shadow:inset 0 0 0 1.5px #141416 !important}
#app .cvx .cvx-pill:hover,#app .cvx .cvx-pill:focus-visible{background:#fd4533 !important;color:#fff !important;box-shadow:inset 0 0 0 1.5px #fd4533 !important}
/* 메뉴 호버(차분하게): 밑줄 없이, 회색 글자가 왼쪽부터 흰색으로 스며들고 앞에 키컬러 점이 살짝 켜짐 */
.nav-links a .nav-roll,.nav-links a:hover .nav-roll,.nav-links a:focus-visible .nav-roll{transform:none !important}
.nav-links a .nav-roll{display:inline-block;color:transparent !important;-webkit-text-fill-color:transparent;background:linear-gradient(90deg,#fff 0 50%,rgba(255,255,255,.72) 50% 100%) 100% 0/200% 100% no-repeat;-webkit-background-clip:text;background-clip:text;transition:background-position .7s cubic-bezier(.22,1,.36,1)}
.nav-links a:hover .nav-roll,.nav-links a:focus-visible .nav-roll,.nav-links a.is-current .nav-roll{background-position:0 0}
.nav-links a .nav-roll::after{display:none !important}
.nav-links a::after{display:none !important}
.nav-links > a,.nav-links .nav-dd > a{position:relative}
.nav-links > a::before,.nav-links .nav-dd > a::before{content:"";position:absolute;left:-10px;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:50%;background:#fd4533;opacity:0;transform:scale(.4);transition:opacity .5s ease,transform .6s cubic-bezier(.22,1,.36,1)}
.nav-links > a:hover::before,.nav-links .nav-dd > a:hover::before,.nav-links > a.is-current::before,.nav-links .nav-dd > a.is-current::before{opacity:1;transform:none}
.nav-links a.is-current{color:inherit !important}
.nav-links > a,.nav-links .nav-dd > a{overflow:visible !important}
#app .cvx .cvx-bot p,#app .cvx .cvx-bot p:has(b){background:#55555d !important}
#app .cvx .cvx-bot p b,#app .cvx .cvx-bot p strong{color:#ff9a8c !important}
/* 메뉴 호버 고도화: 따라다니는 유리 판(nav-glide) + 글자 흰색 스밈. 키컬러 점은 지금 섹션에만 */
.nav-links{position:relative}
.nav-glide{position:absolute;left:0;top:50%;height:36px;width:var(--w,0);transform:translate3d(var(--x,0),-50%,0);border-radius:999px;pointer-events:none;z-index:0;opacity:0;
 background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035));box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 0 0 1px rgba(255,255,255,.07);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
 transition:transform .55s cubic-bezier(.22,1,.36,1),width .55s cubic-bezier(.22,1,.36,1),opacity .35s ease}
.nav-glide.on{opacity:1}
.nav-glide.jump{transition:opacity .35s ease}
.nav-links > a,.nav-links .nav-dd{position:relative;z-index:1}
.nav-links > a:hover::before,.nav-links .nav-dd > a:hover::before{opacity:0;transform:scale(.4)}
.nav-links > a.is-current::before,.nav-links .nav-dd > a.is-current::before{opacity:1 !important;transform:none !important}
@media (prefers-reduced-motion:reduce){.nav-glide{transition:opacity .2s}}
/* 서비스 상세: 상단 고정 서비스 탭 바 — 스크롤해도 헤더 아래 붙어 있어 언제든 다른 서비스로 이동 */
#app .pv-tabbar{position:sticky;top:80px;z-index:40;padding:14px 0;margin-top:96px;transition:background .4s ease,box-shadow .4s ease}
#app .pv-tabbar.is-stuck{background:rgba(14,14,17,.72);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 -1px 0 rgba(255,255,255,.08)}
#app .pv4-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:5px;border-radius:16px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
#app .pv4-tabs a{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;row-gap:5px;align-items:center;padding:13px 18px;border-radius:12px;text-decoration:none;color:rgba(255,255,255,.6);transition:background .35s ease,color .35s ease}
#app .pv4-tabs a em{grid-row:1/3;font:700 11px/1 var(--en);font-style:normal;letter-spacing:.08em;color:#fd4533}
#app .pv4-tabs a b{font:800 15px/1 var(--en);letter-spacing:.01em;color:inherit}
#app .pv4-tabs a small{font:500 12px/1.2 var(--kr);color:rgba(255,255,255,.42);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#app .pv4-tabs a:hover{background:rgba(255,255,255,.06);color:#fff}
#app .pv4-tabs a.on{background:#fd4533;color:#fff}
#app .pv4-tabs a.on em,#app .pv4-tabs a.on small{color:rgba(255,255,255,.85)}
#app .pv-tabbar + .pv3-hero{padding-top:clamp(40px,4vw,64px) !important}
@media (max-width:820px){#app .pv-tabbar{top:70px;margin-top:80px;padding:10px 0}#app .pv4-tabs{grid-template-columns:repeat(4,auto);overflow-x:auto;scrollbar-width:none}#app .pv4-tabs a{padding:10px 12px}#app .pv4-tabs a small{display:none}#app .pv4-tabs a b{font-size:13px;white-space:nowrap}}
#app .pv-tabbar > .wrap{width:min(100% - 2 * var(--pad,72px),1296px);margin:0 auto;padding:0}
#app .pv-tabbar{top:67px}
@media (max-width:820px){#app .pv-tabbar > .wrap{width:calc(100% - 48px)}#app .pv-tabbar{top:70px}}
#app .pv-tabbar > .wrap{margin-left:auto !important;margin-right:auto !important;max-width:1296px !important;width:calc(100% - 144px) !important}
@media (max-width:820px){#app .pv-tabbar > .wrap{width:calc(100% - 48px) !important}}
@media (max-width:820px){#app .pv4-tabs{grid-template-columns:repeat(4,minmax(0,1fr)) !important;overflow:visible !important}#app .pv4-tabs a{display:flex !important;justify-content:center;padding:11px 4px !important}#app .pv4-tabs a em{display:none}#app .pv4-tabs a b{font-size:11.5px !important;letter-spacing:0}}
/* 메뉴 호버(미세): 배경 판 없이 — 글자만 흰색으로 스미며 1px 떠오름 */
.nav-glide{display:none !important}
.nav-links a .nav-roll{transition:background-position .7s cubic-bezier(.22,1,.36,1),transform .5s cubic-bezier(.22,1,.36,1) !important}
.nav-links a:hover .nav-roll,.nav-links a:focus-visible .nav-roll{transform:translateY(-1px) !important}
.nav-links a.is-current .nav-roll{transform:none !important}
#app .pv2-wall p{color:#999 !important}
#app .pv2-wall p b{color:#fff !important;font-weight:800 !important}
/* 서비스 드롭다운 고도화(dd2): 불투명한 유리 패널 · 이름+한글 설명 · 화살표, 호버는 차분하게(왼쪽 키컬러 선 · 화살표 이동) */
.nav-links .dd-panel{padding-top:16px !important}
.nav-links .dd-in.dd2{width:320px;padding:8px !important;border-radius:16px;background:rgba(18,18,22,.94) !important;-webkit-backdrop-filter:blur(20px) saturate(1.2);backdrop-filter:blur(20px) saturate(1.2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),inset 0 1px 0 rgba(255,255,255,.08),0 30px 60px -20px rgba(0,0,0,.7) !important;border:0 !important}
.nav-links .dd2 a.dd-item{position:relative;display:grid !important;grid-template-columns:34px 1fr 18px !important;grid-template-rows:auto !important;align-items:center;column-gap:8px;padding:13px 14px !important;border-radius:11px;border:0 !important;margin:0 !important;color:rgba(255,255,255,.72);transition:background .35s ease,color .35s ease}
.nav-links .dd2 a.dd-item + a.dd-item{margin-top:2px !important}
.nav-links .dd2 a.dd-item::before{content:"";position:absolute;left:0;top:50%;width:2px;height:0;margin-top:0;border-radius:2px;background:#fd4533;transition:height .4s cubic-bezier(.22,1,.36,1),margin-top .4s cubic-bezier(.22,1,.36,1)}
.nav-links .dd2 .dd-no{font:700 10.5px/1 var(--en) !important;letter-spacing:.1em;color:rgba(253,69,51,.85) !important}
.nav-links .dd2 .dd-txt{display:flex;flex-direction:column;gap:5px;min-width:0}
.nav-links .dd2 .dd-name{font:800 14.5px/1 var(--en) !important;letter-spacing:.02em;color:inherit !important}
.nav-links .dd2 .dd-kr{font:500 12px/1.2 var(--kr);color:rgba(255,255,255,.42);transition:color .35s ease}
.nav-links .dd2 .dd-ar{font:400 14px/1 var(--en);color:rgba(255,255,255,.25);transform:translateX(-4px);opacity:0;transition:opacity .35s ease,transform .45s cubic-bezier(.22,1,.36,1),color .35s}
.nav-links .dd2 a.dd-item:hover,.nav-links .dd2 a.dd-item:focus-visible{background:rgba(255,255,255,.05) !important;color:#fff}
.nav-links .dd2 a.dd-item:hover::before,.nav-links .dd2 a.dd-item:focus-visible::before{height:22px;margin-top:-11px}
.nav-links .dd2 a.dd-item:hover .dd-kr{color:rgba(255,255,255,.68)}
.nav-links .dd2 a.dd-item:hover .dd-ar,.nav-links .dd2 a.dd-item:focus-visible .dd-ar{opacity:1;transform:none;color:#fd4533}
.nav-links .dd2 a.dd-one{margin-top:8px !important;border:0 !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.07);border-radius:0 0 11px 11px}
.nav-links .dd2 a.dd-one .dd-name{color:#fd4533 !important}
.nav-links .dd2 a.dd-one:hover{border-radius:11px}
.nav-links .dd2 a.dd-item.is-here{color:#fff;background:rgba(255,255,255,.035) !important}
.nav-links .dd2 a.dd-item.is-here::before{height:22px;margin-top:-11px}
.nav-links .dd2 a.dd-item{padding:11px 14px !important;min-height:0 !important}
.nav-links .dd2 a.dd-item .dd-name,.nav-links .dd2 a.dd-item:hover .dd-name,.nav-links .dd2 a.dd-item .dd-no{transform:none !important}
.nav-links .dd2 a.dd-one,.nav-links .dd2 a.dd-one:hover{box-shadow:none !important;border-radius:11px !important;margin-top:11px !important}
.nav-links .dd2 a.dd-one::after{content:"" !important;display:block !important;position:absolute;left:14px;right:14px;top:-6px;height:1px;background:rgba(255,255,255,.08);transform:none !important}
/* 서비스 탭 심플: 박스 · 배경 · 고정 제거, 이름만 나란히 — 현재 서비스는 키컬러 밑줄 */
#app .pv-tabbar,#app .pv-tabbar.is-stuck{position:relative !important;top:auto !important;background:none !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;box-shadow:none !important;padding:0 !important;margin-top:120px !important}
#app .pv4-tabs{display:flex !important;gap:clamp(24px,3vw,44px) !important;padding:0 !important;border-radius:0 !important;background:none !important;box-shadow:none !important;border-bottom:1px solid rgba(255,255,255,.08)}
#app .pv4-tabs a{display:inline-flex !important;align-items:baseline;gap:8px !important;padding:0 0 14px !important;border-radius:0 !important;background:none !important;position:relative;color:rgba(255,255,255,.45) !important;transition:color .4s ease}
#app .pv4-tabs a small{display:none !important}
#app .pv4-tabs a em{display:inline !important;grid-row:auto !important;font:700 10.5px/1 var(--en) !important;color:rgba(255,255,255,.3) !important;transition:color .4s ease}
#app .pv4-tabs a b{font:700 15px/1 var(--en) !important;letter-spacing:.02em}
#app .pv4-tabs a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#fd4533;transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.22,1,.36,1)}
#app .pv4-tabs a:hover{color:#fff !important}
#app .pv4-tabs a.on{color:#fff !important}
#app .pv4-tabs a.on em{color:#fd4533 !important}
#app .pv4-tabs a.on::after{transform:none}
#app .pv-tabbar + .pv3-hero{padding-top:clamp(28px,3vw,44px) !important}
@media (max-width:820px){#app .pv-tabbar{margin-top:92px !important}#app .pv4-tabs{gap:18px !important;overflow-x:auto;scrollbar-width:none}#app .pv4-tabs a{flex:none;justify-content:flex-start !important;padding:0 0 12px !important}#app .pv4-tabs a em{display:none !important}#app .pv4-tabs a b{font-size:13px !important;white-space:nowrap}}
#app .pv-tabbar + .pv3-hero .pv3-id{margin-top:0 !important}
#app .pv4-tabs{border-bottom:0 !important}
/* Plan First 4단계 고도화(pv4-doc): 건축 도면 모티프 — 상단선 · 세로선 교차점 + 마커, SEC. 좌표 라벨, 영문 인덱스 → 흰 볼드 타이틀 → 회색 설명 */
#app .pv4-doc{position:relative;border-top:1px solid rgba(255,255,255,.16) !important}
#app .pv4-doc li{position:relative;padding:clamp(26px,2.6vw,36px) clamp(20px,2vw,32px) 8px 0 !important}
#app .pv4-doc li+li{padding-left:clamp(20px,2vw,32px) !important;border-left:1px solid rgba(255,255,255,.09) !important}
#app .pv4-doc .bp-x{position:absolute;top:-1px;left:-1px;width:13px;height:13px;transform:translate(-50%,-50%);pointer-events:none}
#app .pv4-doc .bp-x::before,#app .pv4-doc .bp-x::after{content:"";position:absolute;left:50%;top:50%;background:rgba(255,255,255,.55);transform:translate(-50%,-50%)}
#app .pv4-doc .bp-x::before{width:13px;height:1px}#app .pv4-doc .bp-x::after{width:1px;height:13px}
#app .pv4-doc .bp-end{left:auto;right:0;top:0;transform:translate(50%,-50%)}
#app .pv4-doc .bp-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
#app .pv4-doc .bp-h span{display:block;font:800 clamp(30px,3vw,44px)/1 var(--en) !important;letter-spacing:-.04em;color:#fd4533}
#app .pv4-doc .bp-h em{font:600 10px/1 var(--en);font-style:normal;letter-spacing:.16em;color:rgba(255,255,255,.28);padding-top:4px}
#app .pv4-doc small{display:block;margin-top:22px;font:700 11px/1 var(--en);letter-spacing:.18em;color:rgba(255,255,255,.45)}
#app .pv4-doc b{display:block;margin-top:12px;font:800 clamp(18px,1.4vw,20px)/1.4 var(--kr);letter-spacing:-.03em;color:#fff;word-break:keep-all}
#app .pv4-doc p{margin:10px 0 0 !important;font:400 14px/1.65 var(--kr) !important;color:#888 !important;word-break:keep-all}
#app .pv4-doc li:hover .bp-x::before,#app .pv4-doc li:hover .bp-x::after{background:#fd4533}
#app .pv4-doc li:hover .bp-h em{color:rgba(253,69,51,.8)}
#app .pv4-doc .bp-x::before,#app .pv4-doc .bp-x::after,#app .pv4-doc .bp-h em{transition:background .4s ease,color .4s ease}
@media (max-width:820px){#app .pv4-doc li:nth-child(3){border-left:0 !important;padding-left:0 !important}#app .pv4-doc li:nth-child(n+3){border-top:1px solid rgba(255,255,255,.09)}}
#app section:has(.pv4-doc) .fill{font-size:clamp(24px,2.5vw,36px) !important;line-height:1.5 !important}
#app .ct-lead span{display:inline-block;margin-top:6px;font-size:.72em !important;line-height:1.5}
#app .cvx .cvx-pill{box-shadow:inset 0 0 0 1px rgba(20,20,22,.22) !important;color:#3a3a40 !important;font-weight:600 !important}
#app .cvx .cvx-pill:hover,#app .cvx .cvx-pill:focus-visible{box-shadow:inset 0 0 0 1px #fd4533 !important;color:#fff !important}
/* 서비스 상세 히어로 'AX' 인터랙션: 외곽선 → 아래에서 위로 회색이 차오름(로드) → 느린 빛줄기가 간헐적으로 스침 → 이름에 마우스를 올리면 흰색으로 밝아짐 */
@property --axf{syntax:'<percentage>';inherits:false;initial-value:0%}
@property --axs{syntax:'<percentage>';inherits:false;initial-value:-60%}
#app .pv3-name .pv3-ax{color:transparent !important;-webkit-text-fill-color:transparent !important;-webkit-text-stroke:1.5px rgba(255,255,255,.55);
 background:linear-gradient(105deg,transparent calc(var(--axs) - 18%),rgba(255,255,255,.5) var(--axs),transparent calc(var(--axs) + 18%)),linear-gradient(0deg,rgba(255,255,255,var(--axa,.34)) var(--axf),transparent var(--axf));
 -webkit-background-clip:text;background-clip:text;animation:axFill 1.6s cubic-bezier(.22,1,.36,1) .25s both,axSheen 7s ease-in-out 2.2s infinite;transition:--axa .8s ease}
@keyframes axFill{from{--axf:0%}to{--axf:100%}}
@keyframes axSheen{0%,62%{--axs:-60%}100%{--axs:160%}}
@property --axa{syntax:'<number>';inherits:false;initial-value:.34}
#app .pv3-name:hover .pv3-ax{--axa:.92;-webkit-text-stroke-color:rgba(255,255,255,.9)}
#app .pv3-name .pv3-ax{transition:--axa .9s ease,-webkit-text-stroke-color .9s ease}
@media (prefers-reduced-motion:reduce){#app .pv3-name .pv3-ax{animation:none;--axf:100%}}
#app .pv2-doc p span,#app .pv2-doc b span,#app .pv2-doc small span{display:inline !important;font:inherit !important;letter-spacing:inherit !important;color:inherit !important;margin:0 !important}
#app .pv3-intro p.d{color:rgba(255,255,255,.6) !important;font-weight:300 !important;line-height:1.75 !important}
#app .pv3-intro p.d b{color:#fff !important;font-weight:700 !important}
@media (min-width:1101px){#app .pv3-intro p.d{white-space:nowrap}}
/* What You Get 3열 고도화(dgx): 한 줄 정의 → 3대 모듈(흰 볼드 + 회색 설명) → 하단 정렬 산출물 박스 · 좌측 단계 인디케이터 */
#app .dgx-body{height:100%;display:flex !important;flex-direction:column}
#app .dgx-list .dg-item h4{margin-top:12px !important}
#app .dgx-def{margin:20px 0 0;padding-top:18px;border-top:1px solid rgba(255,255,255,.1);font:700 clamp(15px,1.15vw,17px)/1.45 var(--kr) !important;letter-spacing:-.02em;color:#fff !important;word-break:keep-all}
#app .dgx-mods{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:16px}
#app .dgx-mods li{display:grid;gap:5px;padding-left:12px;border-left:1px solid rgba(253,69,51,.45)}
#app .dgx-mods b{font:700 14.5px/1.35 var(--kr);color:#fff;letter-spacing:-.02em}
#app .dgx-mods span{font:400 13px/1.55 var(--kr);color:rgba(255,255,255,.55);word-break:keep-all}
#app .dgx-get{margin-top:auto !important;padding:16px 16px 14px;border-radius:12px;background:#181818;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .dgx-body .dgx-mods + .dgx-get{margin-top:auto}
#app .dgx-get p{margin:0 0 10px;font:700 11px/1 var(--kr);letter-spacing:.06em;color:#fd4533}
#app .dgx-get ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
#app .dgx-get li{display:flex;gap:8px;align-items:flex-start;font:500 13px/1.45 var(--kr);color:rgba(255,255,255,.85);word-break:keep-all}
#app .dgx-get li::before{content:"";flex:none;width:14px;height:14px;margin-top:2px;border-radius:50%;background:rgba(253,69,51,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' fill='none' stroke='%23fd4533' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
#app .dgx-mods{margin-bottom:24px}
#app .dgx-steps{list-style:none;display:flex;align-items:center;gap:6px;margin:26px 0 0;padding:20px 0 0;border-top:1px solid rgba(11,11,13,.1)}
#app .dgx-steps li{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;background:rgba(11,11,13,.06);font:600 12.5px/1 var(--kr);color:rgba(11,11,13,.78);white-space:nowrap}
#app .dgx-steps li em{font:700 10.5px/1 var(--en);font-style:normal;color:#fd4533}
#app .dgx-steps li.dgx-ar{padding:0;background:none;color:rgba(11,11,13,.35);font-size:12px}
#app .dg-offer .dgx-steps + .dg-cta{margin-top:18px}
#app .dgx-body > *{order:0 !important}
#app .dgx-list .dg-item h4{order:0 !important;margin:12px 0 0 !important}
#app .dgx-list .dg-head{order:0 !important}
#app .dgx-get{min-height:136px;box-sizing:border-box}
@media (max-width:1000px){#app .dgx-get{min-height:0}}
/* AX ONE in Action(oa): 좌측 시나리오 탭 → 우측 DESK→STUDIO→GROWTH 파이프라인 + 임팩트. 카드 3열과 다른 형태 */
#app .oa{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);gap:clamp(24px,3vw,56px);margin-top:clamp(28px,3vw,44px);align-items:stretch}
#app .oa-tabs{display:flex;flex-direction:column;border-top:1px solid rgba(255,255,255,.12)}
#app .oa-tab{position:relative;display:flex;flex-direction:column;gap:10px;padding:22px 4px 22px 0;text-align:left;background:none;border:0;border-bottom:1px solid rgba(255,255,255,.1);cursor:pointer;color:rgba(255,255,255,.45);transition:color .4s ease}
#app .oa-tab em{font:700 11px/1 var(--en);font-style:normal;letter-spacing:.14em;color:rgba(255,255,255,.35);transition:color .4s}
#app .oa-tab b{font:700 clamp(17px,1.4vw,21px)/1.4 var(--kr);letter-spacing:-.03em;color:inherit}
#app .oa-tab .oa-bar{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:#fd4533;transform:scaleX(0);transform-origin:left}
#app .oa-tab:hover{color:rgba(255,255,255,.8)}
#app .oa-tab.on{color:#fff}
#app .oa-tab.on em{color:#fd4533}
#app .oa-tab.on .oa-bar{animation:oaBar 8s linear forwards}
#app .oa.paused .oa-tab.on .oa-bar{animation:none;transform:none}
@keyframes oaBar{to{transform:scaleX(1)}}
#app .oa-panels{position:relative;display:grid;border-radius:18px;padding:clamp(28px,3vw,44px);background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.015));box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
#app .oa-panel{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .5s ease,transform .7s cubic-bezier(.22,1,.36,1),visibility 0s .5s;display:flex;flex-direction:column}
#app .oa-panel.on{opacity:1;visibility:visible;transform:none;transition-delay:0s}
#app .oa-q{margin:0;font:600 clamp(15px,1.15vw,17px)/1.5 var(--kr);color:rgba(255,255,255,.6)}
#app .oa-pipe{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
#app .oa-pipe li{position:relative;padding:0 clamp(14px,1.4vw,22px) 0 0}
#app .oa-pipe li+li{padding-left:clamp(14px,1.4vw,22px);border-left:1px solid rgba(255,255,255,.08)}
#app .oa-node{display:flex;align-items:center;gap:8px;font:800 14px/1 var(--en);letter-spacing:.02em;color:#fff}
#app .oa-node em{font:700 10.5px/1 var(--en);font-style:normal;color:#fd4533;letter-spacing:.1em}
#app .oa-pipe li:not(:last-child)::after{content:"→";position:absolute;right:-7px;top:-2px;font:400 14px/1 var(--en);color:rgba(253,69,51,.8);background:#1b1b1f;padding:0 2px;z-index:1}
#app .oa-pipe p{margin:12px 0 0;font:400 14px/1.6 var(--kr);color:rgba(255,255,255,.7);word-break:keep-all}
#app .oa-panel.on .oa-pipe li{animation:oaIn .7s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(.12s + var(--j) * .12s)}
@keyframes oaIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
#app .oa-impact{margin-top:auto;padding-top:26px}
#app .oa-impact{border-top:0}
#app .oa-impact small{display:block;margin:28px 0 8px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);font:700 11px/1 var(--kr);letter-spacing:.08em;color:#fd4533}
#app .oa-impact b{font:800 clamp(20px,1.8vw,26px)/1.35 var(--kr);letter-spacing:-.03em;color:#fff}
#app .oa-more{display:inline-flex;align-items:center;gap:10px;margin-top:28px;font:700 15px/1 var(--kr);color:#fff;text-decoration:none;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.4);transition:border-color .4s,color .4s}
#app .oa-more span{transition:transform .5s cubic-bezier(.22,1,.36,1)}
#app .oa-more:hover{border-color:#fd4533}
#app .oa-more:hover span{transform:translateX(4px)}
#app #oneact .pk-h:has(b){font-weight:300 !important}#app #oneact .pk-h b{font-weight:800;color:#fff}
@media (max-width:900px){#app .oa{grid-template-columns:1fr}#app .oa-pipe{grid-template-columns:1fr;gap:18px}#app .oa-pipe li,#app .oa-pipe li+li{padding:0;border:0}#app .oa-pipe li:not(:last-child)::after{display:none}}
@media (prefers-reduced-motion:reduce){#app .oa-tab.on .oa-bar{animation:none;transform:none}}
#app .oa-pipe li:not(:last-child)::after{content:"" !important;background:none !important;padding:0 !important;right:-4px !important;top:3px !important;width:7px;height:7px;border-top:1.5px solid rgba(253,69,51,.85);border-right:1.5px solid rgba(253,69,51,.85);transform:rotate(45deg)}
/* 서비스 탭 정렬 · 구분: 탭 바 폭을 히어로와 같은 기준(--pad)으로, 탭은 가는 기준선 위의 내비, 아래 라벨은 키컬러 선이 붙은 작은 눈썹 라벨 */
#app .pv-tabbar > .wrap{width:min(calc(100% - 2 * clamp(24px,5vw,80px)),1296px) !important}
@media (max-width:820px){#app .pv-tabbar > .wrap{width:calc(100% - 48px) !important}}
#app .pv4-tabs{box-shadow:inset 0 -1px 0 rgba(255,255,255,.1) !important;gap:clamp(28px,3.2vw,48px) !important}
#app .pv4-tabs a{padding:0 0 16px !important}
#app .pv4-tabs a b{font-size:16px !important}
#app .pv4-tabs a em{font-size:11px !important}
#app .pv4-tabs a.on::after{height:2px;bottom:0}
#app .pv-tabbar + .pv3-hero{padding-top:clamp(36px,3.6vw,56px) !important}
#app .pv4-crumb{display:flex;align-items:center;gap:10px;margin:0 !important;font:700 12px/1 var(--en) !important;letter-spacing:.16em;text-transform:uppercase}
#app .pv4-crumb .pv4-dash{display:block;width:22px;height:2px;border-radius:2px;background:#fd4533}
#app .pv4-crumb b{color:#fd4533 !important;font-weight:700 !important}
#app .pv4-crumb span{color:rgba(255,255,255,.4) !important;font-weight:600 !important}
/* 서비스명 타이포 인터랙션(AX는 그대로): 로드 때 글자가 아래에서 한 자씩 떠오르며 선명해지고, 이름에 마우스를 올리면 글자가 차례로 살짝 들렸다 내려앉는 물결 */
#app .pv3-nm{display:inline-flex;overflow:hidden;padding-bottom:.04em;vertical-align:bottom}
#app .pv3-nm .nm-c{display:inline-block;font-style:normal;transform:translateY(105%);opacity:0;filter:blur(6px);animation:nmIn 1.1s cubic-bezier(.22,1,.36,1) forwards;animation-delay:calc(.45s + var(--l) * .06s)}
@keyframes nmIn{to{transform:none;opacity:1;filter:none}}
#app .pv3-name:hover .pv3-nm .nm-c{animation:nmIn 0s forwards,nmWave .9s cubic-bezier(.22,1,.36,1) both;animation-delay:0s,calc(var(--l) * .05s)}
@keyframes nmWave{0%,100%{transform:none}40%{transform:translateY(-6%)}}
@media (prefers-reduced-motion:reduce){#app .pv3-nm .nm-c{animation:none;transform:none;opacity:1;filter:none}#app .pv3-name:hover .pv3-nm .nm-c{animation:none}}
/* 서비스 상세 벤다이어그램: 다른 서비스 원 · 중앙 AX ONE은 링크 */
#app .pv3-syn .sy-link{pointer-events:auto !important;cursor:pointer;text-decoration:none;color:inherit;transition:color .4s ease}
#app .pv3-syn .sy-link b{transition:color .4s ease}
#app .pv3-syn a.sy-t:hover b{color:#fd4533}
#app .pv3-syn a.sy-t::after{content:"↗";display:block;margin-top:6px;font:400 12px/1 var(--en);color:rgba(255,255,255,.35);transition:color .4s,transform .5s cubic-bezier(.22,1,.36,1)}
#app .pv3-syn a.sy-t:hover::after{color:#fd4533;transform:translate(2px,-2px)}
#app .pv3-syn .sy-core-t{display:flex;flex-direction:column;align-items:center;gap:6px}
#app .pv3-syn .sy-core-t span{font:600 11.5px/1 var(--kr);color:rgba(255,255,255,.85)}
#app .pv3-syn a.sy-core-t:hover b{text-shadow:0 0 18px rgba(255,255,255,.35)}
#app .pv3-syn .sy-k{line-height:1.3;text-align:center}
#app .syn-info p span{display:inline !important;font:inherit !important;letter-spacing:inherit !important;color:inherit !important;text-transform:none !important;margin:0 !important}
#app .syn.syn2 .syn-info p span.gl,#app .pv3-syn .syn-info p span{font:inherit !important;letter-spacing:inherit !important;color:inherit !important;text-transform:none !important}
/* Problem 통계: 메인 첫 화면 숫자와 같은 크기 · 각 칸 가운데 정렬 */
#app .story-nx .nx>div>b{--big:clamp(60px,6.8vw,116px) !important;justify-content:center}
#app .story-nx .nx>div{text-align:center}
#app .story-nx .nx>div>span{font-size:15px !important;margin-top:22px !important}
#app .story-nx .nx>div::before{left:50% !important;transform:translateX(-50%) scale(.7)}
#app .story-nx .nx>div:hover::before{transform:translateX(-50%)}
/* 무료 진단 접지 2차: 한눈에 — 패널마다 아이콘 · 큰 정의 한 줄 · 모듈은 번호+제목만(설명은 패널에 마우스를 올리면 펼쳐짐) · 산출물 박스 */
#app .dgx-body{position:relative}
#app .dgx-ico{position:absolute;right:0;top:-6px;width:64px !important;height:56px !important;opacity:.9;pointer-events:none}
#app .dgx-def{font-size:clamp(18px,1.45vw,21px) !important;line-height:1.4 !important;padding-top:20px !important;margin-top:22px !important}
#app .dgx-mods{gap:0 !important;margin-top:22px !important;border-top:1px solid rgba(255,255,255,.08)}
#app .dgx-mods li{display:grid !important;grid-template-columns:26px 1fr;column-gap:8px;row-gap:0;padding:12px 0 !important;border-left:0 !important;border-bottom:1px solid rgba(255,255,255,.08)}
#app .dgx-mods em{font:700 10.5px/1.6 var(--en);font-style:normal;letter-spacing:.08em;color:#fd4533}
#app .dgx-mods b{font-size:15px !important}
#app .dgx-mods span{grid-column:2;max-height:0;opacity:0;overflow:hidden;transition:max-height .6s cubic-bezier(.22,1,.36,1),opacity .4s ease,margin .4s ease}
#app .dg-item:hover .dgx-mods span,#app .dg-item:focus-within .dgx-mods span{max-height:4.5em;opacity:1;margin-top:6px}
#app .dgx-get{min-height:0 !important;margin-top:26px !important}
@media (min-width:1001px){#app .dgx-get{margin-top:auto !important}}
@media (hover:none),(max-width:1000px){#app .dgx-mods span{max-height:none;opacity:1;margin-top:6px}}
#app .dgx-mods b span{display:inline !important;max-height:none !important;opacity:1 !important;grid-column:auto !important;margin:0 !important;overflow:visible !important;font:inherit !important;color:inherit !important}
/* 서비스 상세 통일: 가격 카드 = 메인 Partnership 카드(pm4) 문법 + 숫자 인덱스 스타일 가격, TO BE 줄 강조, 섹션 번호 라벨 */
#app .pv4-est{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,24px)}
#app .pv4-est .pm4-card{background:linear-gradient(165deg,rgba(255,255,255,.06),rgba(255,255,255,.015)) !important;border:0 !important}
#app .pv4-pk-name{font:800 clamp(22px,1.8vw,28px)/1.2 var(--kr) !important;letter-spacing:-.04em !important}
#app .pv4-price{display:flex;align-items:flex-start;gap:.08em;margin:22px 0 0;font:800 clamp(48px,4.6vw,76px)/1 var(--en);letter-spacing:-.05em;color:#fff}
#app .pv4-price small{margin-top:.12em;font:500 .26em/1 var(--kr);letter-spacing:-.01em;color:rgba(255,255,255,.75)}
#app .pv4-price b.kr{font:800 clamp(24px,2vw,30px)/1.2 var(--kr);letter-spacing:-.04em;color:#fff}
#app .pv4-ps{margin:12px 0 0;font:600 13px/1.5 var(--kr);color:#fd4533}
#app .pv4-est .pm4-card:hover .pv4-price small{color:#fd4533}
@media (max-width:900px){#app .pv4-est{grid-template-columns:1fr}}
#app .pv3-cmp .to-copy:not(:has(b)){color:#fff !important;font-weight:700 !important}
/* 전략 설계의 공식 = 모듈형 노드 & 커넥터(Bento Node): 입력 카드 2 + 원형 연산자 뱃지 + 출력 카드(키컬러 테두리 · 은은한 내부 글로우), 진입 시 0.3초 간격 순차 점등, 호버 시 결과 목록 연동 */
#app #services .vf{position:relative;gap:0 !important;align-items:stretch !important}
#app #services .vf::before{content:"";position:absolute;left:4%;right:4%;top:50%;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.14),rgba(253,69,51,.5));z-index:0}
#app #services .vfx-card{position:relative;z-index:1;flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:10px !important;padding:clamp(22px,2vw,30px) clamp(18px,1.6vw,24px);border-radius:14px;background:#1a1a1a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:box-shadow .5s ease,background .5s ease,opacity .6s ease,transform .8s cubic-bezier(.22,1,.36,1) !important}
#app #services .vfx-idx{position:absolute;top:12px;right:14px;font:700 9.5px/1 var(--en);font-style:normal;letter-spacing:.16em;color:rgba(255,255,255,.35)}
#app #services .vfx-card b{font-size:clamp(20px,1.6vw,26px) !important;white-space:nowrap}
#app #services .vfx-card small{font-size:12.5px !important;white-space:nowrap}
#app #services .vfx-out{box-shadow:inset 0 0 0 1px #fd4533;background:radial-gradient(120% 120% at 50% 100%,rgba(253,69,51,.16),rgba(253,69,51,0) 60%),#1a1a1a}
#app #services .vfx-out .vfx-idx{color:rgba(253,69,51,.85)}
#app #services .vfx-op{position:relative;z-index:1;flex:none;align-self:center;width:32px;height:32px;margin:0 clamp(8px,.9vw,14px);display:grid;place-items:center;border-radius:50%;background:#121214;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);font:500 16px/1 var(--en) !important;color:#fff !important}
#app #services .vfx-op i{font-style:normal;line-height:1;transform:translateY(-1px)}
#app #services .vfx-card:hover{box-shadow:inset 0 0 0 1px rgba(255,255,255,.32)}
#app #services .vfx-out:hover{box-shadow:inset 0 0 0 1px #fd4533,0 20px 50px -24px rgba(253,69,51,.55)}
/* 순차 점등: 입력1 → + → 입력2 → = → 출력(발광) → 결과 */
#app .vf-wrap .vfx-card,#app .vf-wrap .vfx-op{opacity:.18 !important;transform:none !important}
#app .vf-wrap.in .vfx-card,#app .vf-wrap.in .vfx-op{opacity:1 !important}
#app .vf-wrap.in .vf>*:nth-child(1){transition-delay:0s !important}
#app .vf-wrap.in .vf>*:nth-child(2){transition-delay:.3s !important}
#app .vf-wrap.in .vf>*:nth-child(3){transition-delay:.6s !important}
#app .vf-wrap.in .vf>*:nth-child(4){transition-delay:.9s !important}
#app .vf-wrap.in .vf>*:nth-child(5){transition-delay:1.2s !important}
#app .vf-wrap .vn-res{opacity:.2;transition:opacity .8s ease 1.6s}
#app .vf-wrap.in .vn-res{opacity:1}
#app .vf-wrap.in .vfx-out{animation:vfxGlow 1.6s ease 1.2s both}
@keyframes vfxGlow{0%{box-shadow:inset 0 0 0 1px #fd4533}45%{box-shadow:inset 0 0 0 1px #fd4533,0 0 60px -10px rgba(253,69,51,.6)}100%{box-shadow:inset 0 0 0 1px #fd4533}}
#app .vn-run li{transition:color .4s ease,opacity .4s ease}
#app .vn-run.is-hl li{opacity:.35}
#app .vn-run.is-hl li.hl{opacity:1;color:#fff}
#app .vn-run.is-hl li.hl small{color:#fd4533}
@media (max-width:900px){#app #services .vf{flex-direction:column;gap:0 !important}#app #services .vf::before{left:50%;right:auto;top:4%;bottom:4%;width:1px;height:auto}#app #services .vfx-op{margin:10px auto}#app #services .vfx-card{width:100%}}
#app #services .vfx-idx{position:static !important;display:block;margin-bottom:4px;font-size:9.5px !important}
#app #services .vfx-card{justify-content:flex-start !important}
@media (max-width:900px){#app #services .vf{align-items:stretch !important;width:100%}#app #services .vfx-card{align-self:stretch !important;flex:none}#app #services .vf-wrap,#app #services .venn.vf-wrap{justify-items:stretch}}
/* AX ONE in Action 정리: 의미 없는 구분선 제거(탭 사이 · 단계 사이 · 임팩트 위), 진행 막대와 흐름 화살표만 유지 + 단계마다 서비스 애니메이션 아이콘 */
#app .oa-tabs{border-top:0 !important;gap:6px}
#app .oa-tab{border-bottom:0 !important;padding:18px 18px 20px !important;border-radius:12px;transition:background .4s ease,color .4s ease}
#app .oa-tab .oa-bar{left:18px;right:18px;width:auto;bottom:8px}
#app .oa-tab.on{background:rgba(255,255,255,.04)}
#app .oa-pipe li+li{border-left:0 !important}
#app .oa-pipe{gap:clamp(18px,2vw,32px) !important}
#app .oa-pipe li{padding:0 !important}
#app .oa-pipe li:not(:last-child)::after{right:calc(clamp(18px,2vw,32px) / -2 - 4px) !important;top:44px !important}
#app .oa-ico{display:block;width:92px !important;height:76px !important;margin:0 0 14px -8px}
#app .oa-impact small{border-top:0 !important;padding-top:0 !important;margin-top:34px !important}
@media (max-width:900px){#app .oa-ico{width:76px !important;height:62px !important}}
#app .oa-ico{width:128px !important;height:104px !important;margin:-6px 0 12px -14px !important}
#app .oa-pipe li:not(:last-child)::after{top:52px !important}
/* AX 채움 잘림 수정: 자간이 좁아 X 오른쪽 끝이 글자 상자 밖으로 나가 채움이 끊기던 것 — 상자를 넓히고 같은 만큼 되돌림 */
#app .pv3-name .pv3-ax{display:inline-block;padding:0 .14em .06em .04em !important;margin:0 -.14em -.06em -.04em !important;background-origin:border-box;-webkit-background-clip:text;background-clip:text}
#app .pv3-nm{padding:0 .12em .06em 0 !important;margin:0 -.12em -.06em 0 !important}
#app .story-nx>p{color:rgba(255,255,255,.26) !important;letter-spacing:0 !important;margin-top:22px !important}
#app #planningStory .story-nx>p{font-weight:300 !important;line-height:1.5 !important}

/* STUDIO 2블록 (stcHTML): 다루는 범위 + 제작 방식 탭 · 드래그 비교 */
#app .stc-q{list-style:none;margin:clamp(34px,3.6vw,52px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.6vw,40px)}
#app .stc-q li{position:relative;padding-top:22px}
#app .stc-q li::before{content:"";position:absolute;left:0;top:0;width:36px;height:2px;background:#fd4533}
#app .stc-q em{font:700 11px/1 var(--en);font-style:normal;letter-spacing:.14em;color:rgba(255,255,255,.5)}
#app .stc-q h4{margin:14px 0 0;font:800 clamp(22px,2vw,30px)/1.25 var(--kr);letter-spacing:-.04em;color:#fff}
#app .stc-q p{margin:12px 0 0;font:400 15px/1.6 var(--kr);color:rgba(255,255,255,.66)}
#app .stc-q p b{color:#fff;font-weight:700}
#app .stc-line{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.6vw,40px);margin-top:clamp(34px,3.6vw,52px);padding-top:22px;border-top:1px solid rgba(255,255,255,.12)}
#app .stc-line span{font:600 16px/1.5 var(--kr);color:#fff}
#app .stc-line small{display:block;margin-bottom:8px;font:700 11px/1 var(--kr);letter-spacing:.06em;color:rgba(255,255,255,.5)}
#app .stc-m{margin-top:clamp(28px,3vw,44px)}
#app .stc-radio{position:absolute;opacity:0;pointer-events:none}
#app .stc-tabs{display:flex;flex-wrap:wrap;gap:clamp(18px,2.6vw,40px);border-bottom:1px solid rgba(255,255,255,.1)}
#app .stc-tabs label{position:relative;display:flex;gap:10px;align-items:baseline;padding-bottom:14px;cursor:pointer;color:rgba(255,255,255,.45);font:700 clamp(15px,1.2vw,18px)/1.3 var(--kr);transition:color .4s ease}
#app .stc-tabs label em{font:700 11px/1 var(--en);font-style:normal;color:#fd4533}
#app .stc-tabs label::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#fd4533;transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.22,1,.36,1)}
#app .stc-tabs label:hover{color:#fff}
#app .stc-p{display:none}
#app #stc-0:checked ~ .stc-tabs label[for="stc-0"]{color:#fff}
#app #stc-0:checked ~ .stc-tabs label[for="stc-0"]::after{transform:scaleX(1)}
#app #stc-0:checked ~ .stc-panels .stc-p0{display:block}
#app #stc-1:checked ~ .stc-tabs label[for="stc-1"]{color:#fff}
#app #stc-1:checked ~ .stc-tabs label[for="stc-1"]::after{transform:scaleX(1)}
#app #stc-1:checked ~ .stc-panels .stc-p1{display:block}
#app #stc-2:checked ~ .stc-tabs label[for="stc-2"]{color:#fff}
#app #stc-2:checked ~ .stc-tabs label[for="stc-2"]::after{transform:scaleX(1)}
#app #stc-2:checked ~ .stc-panels .stc-p2{display:block}
#app #stc-3:checked ~ .stc-tabs label[for="stc-3"]{color:#fff}
#app #stc-3:checked ~ .stc-tabs label[for="stc-3"]::after{transform:scaleX(1)}
#app #stc-3:checked ~ .stc-panels .stc-p3{display:block}
#app .stc-cmp{position:relative;margin-top:30px;height:clamp(200px,22vw,300px);border-radius:14px;overflow:hidden;background:#161618;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
#app .stc-lay{position:absolute;inset:0;padding:clamp(24px,2.6vw,40px);display:flex;flex-direction:column;justify-content:center;gap:12px}
#app .stc-before{background:#161618}
#app .stc-after{background:#1f1f23;clip-path:inset(0 0 0 var(--p))}
#app .stc-lay small{font:700 11px/1 var(--kr);letter-spacing:.06em;color:rgba(255,255,255,.5)}
#app .stc-after small{color:#fd4533}
#app .stc-lay p{margin:0;font:700 clamp(20px,2vw,30px)/1.35 var(--kr);letter-spacing:-.03em;color:#fff;word-break:keep-all}
#app .stc-before p{color:rgba(255,255,255,.5);font-weight:500}
#app .stc-hd{position:absolute;top:0;bottom:0;left:var(--p);width:2px;background:#fd4533;transform:translateX(-1px);pointer-events:none}
#app .stc-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
@media (max-width:820px){#app .stc-q,#app .stc-line{grid-template-columns:1fr}}
#app .stc-after{padding-left:calc(var(--p) + clamp(24px,2.6vw,40px))}

/* STUDIO 2단계 (ch1 · ch2 · ch3) — 텍스트 나열 대신 도식: 근거 → 5단계 → 콘셉트 · 비율 전환 프레임 · 검사 흐름 */
#app .ch1{margin-top:clamp(34px,3.6vw,52px);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:clamp(14px,1.8vw,26px)}
#app .ch1-ev,#app .ch1-rail,#app .ch1-out{list-style:none;margin:0;padding:0;display:grid;gap:10px}
#app .ch1-ev li{padding:18px 18px 16px;border-radius:12px;background:#1a1a1a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .ch1-rail{position:relative;padding-left:18px}
#app .ch1-rail::before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:1px;background:linear-gradient(180deg,rgba(255,255,255,.2),rgba(253,69,51,.7))}
#app .ch1-rail li{position:relative;display:flex;gap:10px;align-items:center;font:700 15px/1 var(--kr);color:#fff}
#app .ch1-rail li::before{content:"";position:absolute;left:-18px;width:9px;height:9px;border-radius:50%;background:#121214;box-shadow:inset 0 0 0 1.5px #fd4533}
#app .ch1-rail em,#app .ch1-ev em{font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:#fd4533}
#app .ch1-ev em{display:block;margin-bottom:10px;color:rgba(255,255,255,.5)}
#app .ch1-ev b{font:800 clamp(16px,1.3vw,19px)/1.3 var(--kr);letter-spacing:-.03em;color:#fff}
#app .ch1-out li{padding:16px 18px;border-radius:12px;background:linear-gradient(160deg,rgba(253,69,51,.14),rgba(253,69,51,0)),#1a1a1a;box-shadow:inset 0 0 0 1px rgba(253,69,51,.55)}
#app .ch1-out span{font:800 clamp(16px,1.3vw,19px)/1.3 var(--kr);letter-spacing:-.03em;color:#fff}
#app .ch1-who{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0 0}
#app .ch1-who b{font:700 13px/1 var(--kr);color:rgba(255,255,255,.55);margin-right:6px}
#app .ch1-who span{padding:9px 14px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);font:600 13px/1 var(--kr);color:#fff}
#app .ch2{margin-top:clamp(34px,3.6vw,52px)}
#app .ch2-radio{position:absolute;opacity:0;pointer-events:none}
#app .ch2-tabs{display:flex;flex-wrap:wrap;gap:10px}
#app .ch2-tabs label{cursor:pointer;display:flex;gap:10px;align-items:baseline;padding:11px 16px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);color:rgba(255,255,255,.6);transition:background .4s,color .4s,box-shadow .4s}
#app .ch2-tabs label b{font:800 14px/1 var(--en);color:inherit}
#app .ch2-tabs label span{font:500 12px/1 var(--kr)}
#app .ch2-tabs label:hover{color:#fff}
#app .ch2-stage{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:clamp(26px,4vw,64px);align-items:center;margin-top:30px}
#app .ch2-frame{position:relative;width:min(100%,360px);aspect-ratio:1/1;border-radius:14px;background:#161618;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);overflow:hidden;transition:aspect-ratio .7s cubic-bezier(.22,1,.36,1),width .7s cubic-bezier(.22,1,.36,1)}
#app .ly{position:absolute;display:block;border-radius:8px}
#app .ly-bg{inset:0;border-radius:0;background:#1f1f23}
#app .ly-pr{left:18%;top:16%;width:64%;height:56%;background:linear-gradient(160deg,#f1f1f3,#8b8b93);box-shadow:0 14px 30px -18px rgba(0,0,0,.8)}
#app .ly-tx{left:10%;bottom:24%;width:52%;height:9%;background:#fff}
#app .ly-cta{left:10%;bottom:10%;width:30%;height:8%;background:#fd4533;border-radius:999px}
#app .ch2-layers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#app .ch2-layers li{padding:16px 16px;border-radius:12px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);font:700 16px/1.2 var(--kr);color:#fff}
#app .ch2-layers em{display:block;margin-bottom:8px;font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:#fd4533}
#app .ch2-stage .ch2-frame{width:min(100%,320px)}
#app #c2-0:checked ~ .ch2-stage .ch2-frame{aspect-ratio:1/1}
#app #c2-1:checked ~ .ch2-stage .ch2-frame{aspect-ratio:4/5}
#app #c2-2:checked ~ .ch2-stage .ch2-frame{aspect-ratio:9/16;width:min(100%,250px)}
#app #c2-3:checked ~ .ch2-stage .ch2-frame{aspect-ratio:16/9;width:min(100%,400px)}
#app #c2-0:checked ~ .ch2-tabs label[for="c2-0"],#app #c2-1:checked ~ .ch2-tabs label[for="c2-1"],#app #c2-2:checked ~ .ch2-tabs label[for="c2-2"],#app #c2-3:checked ~ .ch2-tabs label[for="c2-3"]{background:#fd4533;color:#fff;box-shadow:none}
#app .ch3{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(26px,4vw,64px);align-items:center;margin-top:clamp(30px,3vw,44px)}
#app .ch3-flow{list-style:none;margin:clamp(34px,3.6vw,52px) 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;position:relative}
#app .ch3-flow li{position:relative;padding:18px 14px;border-radius:12px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);font:700 clamp(13px,1vw,15px)/1.35 var(--kr);color:#fff}
#app .ch3-flow li+li::before{content:"→";position:absolute;left:-11px;top:50%;transform:translateY(-50%);font:400 14px/1 var(--en);color:rgba(253,69,51,.8);z-index:1}
#app .ch3-flow em{display:block;margin-bottom:8px;font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:rgba(255,255,255,.5)}
#app .ch3-flow li:nth-child(4){box-shadow:inset 0 0 0 1px #fd4533}
#app .ch3-checks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#app .ch3-checks li{position:relative;padding:20px 18px;border-radius:12px;background:#1a1a1a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .ch3-checks li::after{content:"";position:absolute;right:16px;top:20px;width:8px;height:8px;border-radius:50%;background:#7bd389}
#app .ch3-checks li.warn::after{background:#fd4533;box-shadow:0 0 12px rgba(253,69,51,.7)}
#app .ch3-checks b{display:block;font:800 clamp(18px,1.5vw,22px)/1.2 var(--kr);letter-spacing:-.03em;color:#fff}
#app .ch3-checks small{display:block;margin-top:10px;font:600 12.5px/1 var(--kr);color:rgba(255,255,255,.6)}
#app .ch3-frame{position:relative;width:min(100%,220px);aspect-ratio:9/16;border-radius:16px;background:#161618;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);overflow:hidden}
#app .ch3-ph{position:absolute;left:14%;right:14%;top:32%;bottom:30%;border-radius:12px;background:linear-gradient(160deg,#f1f1f3,#8b8b93)}
#app .ch3-safe{position:absolute;left:0;right:0;height:16%;background:repeating-linear-gradient(135deg,rgba(253,69,51,.22) 0 6px,rgba(253,69,51,.05) 6px 12px)}
#app .ch3-top{top:0}#app .ch3-bot{bottom:0}
#app .ch3-flag{position:absolute;right:12px;top:calc(32% - 22px);padding:7px 10px;border-radius:999px;background:#fd4533;font:700 11px/1 var(--kr);color:#fff}
#app .ch3-note{margin:22px 0 0;font:500 12.5px/1.5 var(--kr);color:rgba(255,255,255,.45)}
@media (max-width:900px){#app .ch1{grid-template-columns:1fr}#app .ch1-rail::before{top:8px;bottom:8px}#app .ch2-stage{grid-template-columns:1fr}#app .ch3{grid-template-columns:1fr}#app .ch3-flow{grid-template-columns:1fr}#app .ch3-flow li+li::before{display:none}}
@media (max-width:820px){#app .stc-cmp{height:auto;display:grid;gap:0}#app .stc-lay{position:static;min-height:0;padding:24px}#app .stc-after{clip-path:none;padding-left:24px;background:#1f1f23}#app .stc-hd,#app .stc-range{display:none}#app .stc-before{border-bottom:1px solid rgba(255,255,255,.1)}#app .ch2-layers{grid-template-columns:1fr 1fr}#app .ch2-stage .ch2-frame{width:100%}}
/* 2단계 도식 v2: 서비스 아이콘 · 벤다이어그램 · 기기 모양(정사각 · 세로 카드 · 폰 · 노트북) */
#app .ch1v{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,4vw,64px);align-items:center;margin-top:clamp(34px,3.6vw,52px)}
#app .cv-wrap{position:relative;width:min(100%,460px);aspect-ratio:1/1;margin:0 auto}
#app .cv{position:absolute;width:56%;aspect-ratio:1/1;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;background:rgba(255,255,255,.02);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);transition:box-shadow .5s ease,background .5s ease}
#app .cv:hover{box-shadow:inset 0 0 0 1px rgba(253,69,51,.7);background:rgba(253,69,51,.04)}
#app .cv-a{left:0;top:4%}
#app .cv-b{right:0;top:4%}
#app .cv-d{left:22%;bottom:0}
#app .cv-ico{width:64px !important;height:52px !important;margin-bottom:2px}
#app .cv small{font:700 10.5px/1 var(--en);letter-spacing:.12em;color:#fd4533}
#app .cv b{font:800 clamp(14px,1.2vw,17px)/1.2 var(--kr);letter-spacing:-.03em;color:#fff}
#app .cv-core{position:absolute;left:33%;top:33%;width:34%;aspect-ratio:1/1;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(closest-side,rgba(253,69,51,.42),rgba(253,69,51,.12) 70%,rgba(253,69,51,.04));box-shadow:inset 0 0 0 1.5px #fd4533,0 0 40px -10px rgba(253,69,51,.55);z-index:1}
#app .cv-core small{font:800 clamp(13px,1.2vw,16px)/1 var(--kr);letter-spacing:-.02em;color:#fff}
#app .cv-goal{position:absolute;right:0;bottom:-4px;padding:9px 14px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);font:600 12.5px/1 var(--kr);color:rgba(255,255,255,.75);white-space:nowrap}
#app .cv-goal em{font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.1em;color:#fd4533;margin-right:8px}
#app .ch1-side{display:grid;gap:22px}
#app .ch1-rail{list-style:none;margin:0;padding:0;display:grid;gap:10px}
#app .ch1-rail li{display:flex;gap:12px;align-items:center;padding:12px 16px;border-radius:12px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);font:700 15px/1 var(--kr);color:#fff}
#app .ch1-rail em{font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:#fd4533}
#app .ch1-out{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#app .ch1-out li{padding:16px 14px;border-radius:12px;background:rgba(253,69,51,.08);box-shadow:inset 0 0 0 1px rgba(253,69,51,.5);text-align:center}
#app .ch1-out span{font:800 clamp(14px,1.2vw,17px)/1.2 var(--kr);letter-spacing:-.03em;color:#fff}
#app .ch1-who{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0}
#app .ch1-who b{font:700 13px/1 var(--kr);color:rgba(255,255,255,.55);margin-right:6px}
#app .ch1-who span{padding:9px 14px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);font:600 13px/1 var(--kr);color:#fff}
#app .ch2-stage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.7fr);gap:clamp(26px,4vw,64px);align-items:center;margin-top:30px}
#app .ch2-dev{display:flex;align-items:center;justify-content:center;min-height:clamp(360px,38vw,460px)}
#app .dv{position:relative;display:none}
#app .dv-screen{position:relative;width:100%;height:100%;overflow:hidden;background:#1f1f23}
#app .ly{position:absolute;display:block;border-radius:8px}
#app .ly-bg{inset:0;border-radius:0;background:#1f1f23}
#app .ly-pr{left:18%;top:16%;width:64%;height:50%;background:linear-gradient(160deg,#f1f1f3,#8b8b93);box-shadow:0 14px 30px -18px rgba(0,0,0,.8)}
#app .ly-tx{left:10%;bottom:24%;width:52%;height:8%;background:#fff}
#app .ly-cta{left:10%;bottom:10%;width:30%;height:7%;background:#fd4533;border-radius:999px}
#app .dv-sq{width:min(100%,300px);aspect-ratio:1/1;border-radius:16px;background:#0f0f11;padding:10px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
#app .dv-sq .dv-screen,#app .dv-port .dv-screen{border-radius:10px}
#app .dv-port{width:min(100%,260px);aspect-ratio:4/5;border-radius:16px;background:#0f0f11;padding:10px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
#app .dv-phone{width:min(100%,230px);aspect-ratio:9/19;border-radius:38px;background:#0b0b0d;padding:12px;box-shadow:inset 0 0 0 2px #2b2b31,0 30px 60px -30px rgba(0,0,0,.9)}
#app .dv-phone .dv-screen{height:100%;border-radius:28px}
#app .dv-notch{position:absolute;top:20px;left:50%;transform:translateX(-50%);width:78px;height:20px;border-radius:12px;background:#0b0b0d;z-index:2}
#app .dv-lap{width:min(100%,440px);padding:14px 14px 0;border-radius:16px 16px 6px 6px;background:#0f0f11;box-shadow:inset 0 0 0 2px #2b2b31;margin-bottom:14px}
#app .dv-lap .dv-screen{aspect-ratio:16/9;border-radius:6px;height:auto}
#app .dv-base{position:absolute;left:-7%;right:-7%;bottom:-14px;height:14px;border-radius:0 0 16px 16px;background:linear-gradient(#2b2b31,#17171a)}
#app #c2-0:checked ~ .ch2-stage .dv-sq,#app #c2-1:checked ~ .ch2-stage .dv-port,#app #c2-2:checked ~ .ch2-stage .dv-phone,#app #c2-3:checked ~ .ch2-stage .dv-lap{display:block}
#app .ch2-layers{grid-template-columns:1fr 1fr}
#app .ch3{align-items:center}
#app .dv3{display:block !important;width:min(100%,220px);aspect-ratio:9/19;margin:0 auto}
#app .dv3 .ch3-safe{position:absolute;left:0;right:0;height:14%;background:repeating-linear-gradient(135deg,rgba(253,69,51,.24) 0 6px,rgba(253,69,51,.05) 6px 12px)}
#app .dv3 .ch3-top{top:0}#app .dv3 .ch3-bot{bottom:0}
#app .dv3 .ch3-ph{position:absolute;left:12%;right:12%;top:30%;bottom:28%;border-radius:12px;background:linear-gradient(160deg,#f1f1f3,#8b8b93)}
#app .dv3 .ch3-flag{position:absolute;right:10px;top:calc(30% - 22px);padding:7px 10px;border-radius:999px;background:#fd4533;font:700 11px/1 var(--kr);color:#fff}
@media (max-width:900px){#app .ch1v{grid-template-columns:1fr}#app .ch2-stage{grid-template-columns:1fr}}
#app .dv3{width:220px !important;max-width:100% !important;justify-self:center}
/* STUDIO 3단계: ⑦ 브랜드의 분신(브랜드북 펼침) · ⑧ 이런 과제라면 · ⑩ 브리프 보내기 · 벤다이어그램 아이콘 크기 */
#app .cv-ico{width:76px !important;height:62px !important}
#app .cv{width:60%}
#app .cv-core{left:31%;top:31%;width:38%}
#app .ch4{margin-top:clamp(34px,3.6vw,52px)}
#app .ch4-book{position:relative;display:grid;grid-template-columns:1fr 1fr;border-radius:18px;background:#f4f1ea;color:#141416;box-shadow:0 40px 80px -48px rgba(0,0,0,.9);overflow:hidden}
#app .ch4-page{padding:clamp(26px,3vw,44px)}
#app .ch4-page small{display:block;font:700 11px/1 var(--kr);letter-spacing:.08em;color:#fd4533;margin-bottom:18px}
#app .ch4-l ol{list-style:none;margin:0;padding:0;display:grid;gap:12px}
#app .ch4-l li{display:flex;gap:12px;align-items:baseline}
#app .ch4-l em{font:700 11px/1 var(--en);font-style:normal;color:#fd4533}
#app .ch4-l b{font:800 clamp(18px,1.6vw,24px)/1.2 var(--kr);letter-spacing:-.03em}
#app .ch4-r ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
#app .ch4-r li b{display:block;font:800 clamp(17px,1.5vw,21px)/1.2 var(--kr);letter-spacing:-.03em}
#app .ch4-r li span{display:block;margin-top:5px;font:500 14px/1.5 var(--kr);color:#55555c}
#app .ch4-r li.is-link b{color:#fd4533}
#app .ch4-spine{position:absolute;left:50%;top:14px;bottom:14px;width:1px;background:rgba(20,20,22,.14)}
#app .ch4-decide{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:20px}
#app .ch4-decide small{font:700 13px/1 var(--kr);color:rgba(255,255,255,.55);margin-right:6px}
#app .ch4-decide span{padding:9px 14px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);font:600 13px/1 var(--kr);color:#fff}
@media (max-width:820px){#app .ch4-book{grid-template-columns:1fr}#app .ch4-spine{display:none}}
#app .cs-list{list-style:none;margin:clamp(34px,3.6vw,52px) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#app .cs-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;padding:20px 22px;border-radius:12px;background:#1a1a1a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:box-shadow .4s ease}
#app .cs-list li:hover{box-shadow:inset 0 0 0 1px rgba(253,69,51,.6)}
#app .cs-q{font:600 15px/1.45 var(--kr);color:rgba(255,255,255,.7)}
#app .cs-q em{display:block;margin-bottom:8px;font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:#fd4533}
#app .cs-a{padding:9px 14px;border-radius:999px;background:rgba(253,69,51,.12);box-shadow:inset 0 0 0 1px rgba(253,69,51,.5);font:800 14px/1.2 var(--kr);color:#fff;white-space:nowrap}
#app .cs-note{margin:22px 0 0;font:500 13px/1.5 var(--kr);color:rgba(255,255,255,.5)}
@media (max-width:820px){#app .cs-list{grid-template-columns:1fr}#app .cs-list li{grid-template-columns:1fr}#app .cs-a{justify-self:start;white-space:normal}}
#app .brief{margin-top:28px;padding:clamp(24px,2.6vw,36px);border-radius:16px;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015));box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
#app .brief-h{margin:0 0 20px;font:800 clamp(20px,1.8vw,26px)/1.2 var(--kr);letter-spacing:-.03em;color:#fff}
#app .brief-f{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
#app .brief label{display:grid;gap:8px}
#app .brief label small{font:700 11.5px/1 var(--kr);color:rgba(255,255,255,.55)}
#app .brief input,#app .brief select{width:100%;padding:13px 14px;border:0;border-radius:10px;background:#141416;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);font:500 15px/1.2 var(--kr);color:#fff;outline:0}
#app .brief input:focus,#app .brief select:focus{box-shadow:inset 0 0 0 1px #fd4533}
#app .brief .btn{margin-top:20px}
#app .brief-n{margin:14px 0 0;font:500 13px/1.5 var(--kr);color:rgba(255,255,255,.5)}
@media (max-width:820px){#app .brief-f{grid-template-columns:1fr}}
/* 브랜드북 펼침은 크림 종이이므로 글자는 진한 색 */
#app .ch4-page b,#app .ch4-page li b,#app .ch4-page span{color:#141416 !important}
#app .ch4-l b{color:#141416 !important}
#app .ch4-r li span{color:#55555c !important}
#app .ch4-r li.is-link b{color:#fd4533 !important}
#app .ch4-decide span{color:#fff !important}
/* 벤다이어그램: 원이 타원으로 늘어나던 것 수정 — 정원 유지, 라벨은 원 안쪽 */
#app .cv{height:auto !important;aspect-ratio:1/1 !important;width:58% !important;padding:14% 12% 0;justify-content:flex-start}
#app .cv-a{left:0 !important;top:2% !important}
#app .cv-b{right:0 !important;top:2% !important;left:auto !important;bottom:auto !important}
#app .cv-d{left:21% !important;right:auto !important;top:auto !important;bottom:0 !important}
#app .cv-core{height:auto !important;aspect-ratio:1/1 !important;width:36% !important;left:32% !important;top:32% !important}
#app .cv b{font-size:clamp(12px,1.05vw,15px) !important}
#app .cv small{font-size:9.5px !important}
#app .cv-ico{width:58px !important;height:48px !important;margin-bottom:0}
/* 벤다이어그램 정원 고정: 래퍼를 정사각으로 두고 높이 늘어남 방지, 세 원 중심은 정삼각 배치, 중앙 라벨 */
#app .ch1v .cv-wrap{align-self:center;height:0;padding-bottom:min(100%,460px);width:min(100%,460px);aspect-ratio:auto}
#app .cv-wrap{position:relative}
#app .cv{width:50% !important;padding:0 !important;justify-content:center !important;text-align:center}
#app .cv-a{left:4% !important;top:4% !important}
#app .cv-b{left:auto !important;right:4% !important;top:4% !important}
#app .cv-d{left:25% !important;top:auto !important;bottom:2% !important;right:auto !important}
#app .cv-core{left:34% !important;top:34% !important;width:32% !important}
#app .cv-core small{font-size:12px !important}
#app .cv-goal{bottom:-8px}
/* 원 정사각 확정: 높이를 너비와 같은 값으로 고정(상속된 높이 규칙 무력화) */
#app .cv-wrap .cv{width:230px !important;height:230px !important;max-width:50% !important;aspect-ratio:auto !important}
#app .cv-wrap .cv-a{left:0 !important;top:0 !important}
#app .cv-wrap .cv-b{left:auto !important;right:0 !important;top:0 !important}
#app .cv-wrap .cv-d{left:115px !important;top:auto !important;bottom:0 !important;right:auto !important}
#app .cv-wrap .cv-core{width:150px !important;height:150px !important;left:155px !important;top:155px !important}
/* 최소 높이 440px(v239)이 정원을 세로로 늘리던 것 해제 */
#app .cv-wrap .cv{min-height:0 !important;flex:none !important}
/* 9 · 함께 쓰면 (STUDIO): 조합 두 개 링크 + AX ONE 한 줄 */
#app .pair-row{list-style:none;margin:clamp(26px,3vw,40px) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#app .pair-row a{display:flex;flex-direction:column;gap:10px;padding:20px 22px;border-radius:12px;background:#1a1a1a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);text-decoration:none;transition:box-shadow .4s ease,background .4s ease}
#app .pair-row a:hover{box-shadow:inset 0 0 0 1px rgba(253,69,51,.6);background:#1d1d20}
#app .pair-row em{font:700 11px/1 var(--en);font-style:normal;letter-spacing:.12em;color:#fd4533}
#app .pair-row span{font:800 clamp(17px,1.5vw,21px)/1.25 var(--kr);letter-spacing:-.03em;color:#fff}
#app .pair-one{margin:18px 0 0;font:500 14px/1.6 var(--kr);color:rgba(255,255,255,.6)}
#app .pair-one a{color:#fff;border-bottom:1px solid rgba(255,255,255,.4);padding-bottom:2px;margin-left:4px}
@media (max-width:820px){#app .pair-row{grid-template-columns:1fr}}
/* 벤다이어그램 강조: 지금 보는 서비스 원과 그 교집합 두 개만 선명, 나머지는 옅게 */
#app .pv3-syn .sy-c:not(.is-cur){stroke:rgba(255,255,255,.12) !important;fill:rgba(255,255,255,.01) !important;transition:stroke .5s,fill .5s}
#app .pv3-syn .sy-c.is-cur{stroke:#fd4533 !important;stroke-width:2 !important;fill:rgba(253,69,51,.14) !important}
#app .pv3-syn .sy-l{opacity:.14 !important;transition:opacity .6s ease,fill .6s ease}
#app .pv3-syn[data-cur="a"] .sy-l[data-l="ab"],#app .pv3-syn[data-cur="a"] .sy-l[data-l="ac"],#app .pv3-syn[data-cur="b"] .sy-l[data-l="ab"],#app .pv3-syn[data-cur="b"] .sy-l[data-l="bc"],#app .pv3-syn[data-cur="c"] .sy-l[data-l="ac"],#app .pv3-syn[data-cur="c"] .sy-l[data-l="bc"]{opacity:1 !important;fill:rgba(253,69,51,.42) !important}
#app .pv3-syn .sy-k{opacity:.35;transition:opacity .5s ease}
#app .pv3-syn[data-cur="a"] .sy-k[data-k="ab"],#app .pv3-syn[data-cur="a"] .sy-k[data-k="ac"],#app .pv3-syn[data-cur="b"] .sy-k[data-k="ab"],#app .pv3-syn[data-cur="b"] .sy-k[data-k="bc"],#app .pv3-syn[data-cur="c"] .sy-k[data-k="ac"],#app .pv3-syn[data-cur="c"] .sy-k[data-k="bc"]{opacity:1;color:#fff}
#app .pv3-syn .sy-t:not(.is-cur){opacity:.42;transition:opacity .5s ease}
#app .pv3-syn .sy-t.is-cur{opacity:1}
#app .pv3-syn[data-cur] .sy-l[data-l]:not([style]){fill:rgba(253,69,51,.34) !important}
#app .pv3-syn .sy-core{fill:#fd4533 !important;opacity:.92}
/* 서비스 상세의 섹션 상단 옅은 선(::before) 제거 — 메인과 같은 규칙, 구분은 여백으로 */
#app .pv2 .sec::before,#app .pv2 section.sec::before{display:none !important}
/* 전략 설계의 공식 인터랙션 v2: 뻑뻑한 박스-섀도 키프레임 제거 → 불투명도·이동만 사용(부드러움), 한 흐름으로 순차 등장 */
#app #services .vf-wrap .vfx-card,#app #services .vf-wrap .vfx-op{opacity:0 !important;transform:translateY(14px) !important;transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1) !important;will-change:opacity,transform}
#app #services .vf-wrap.in .vfx-card,#app #services .vf-wrap.in .vfx-op{opacity:1 !important;transform:none !important}
#app #services .vf-wrap.in .vf>*:nth-child(1){transition-delay:.05s !important}
#app #services .vf-wrap.in .vf>*:nth-child(2){transition-delay:.25s !important}
#app #services .vf-wrap.in .vf>*:nth-child(3){transition-delay:.45s !important}
#app #services .vf-wrap.in .vf>*:nth-child(4){transition-delay:.65s !important}
#app #services .vf-wrap.in .vf>*:nth-child(5){transition-delay:.85s !important}
/* 출력 카드 발광: 그림자 애니메이션 대신 발광 레이어의 투명도만 변함 */
#app #services .vfx-out{animation:none !important;box-shadow:inset 0 0 0 1px #fd4533 !important;overflow:hidden}
#app #services .vfx-out::after{content:"";position:absolute;inset:-30%;background:radial-gradient(closest-side,rgba(253,69,51,.32),rgba(253,69,51,0));opacity:0;transform:scale(.8);transition:opacity 1.2s ease 1.1s,transform 1.4s cubic-bezier(.22,1,.36,1) 1.1s;pointer-events:none;z-index:-1}
#app #services .vf-wrap.in .vfx-out::after{opacity:1;transform:scale(1)}
#app #services .vfx-out>*{position:relative;z-index:1}
/* 연결선: 한 번에 그어지는 선 */
#app #services .vf::before{transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.22,1,.36,1) .4s}
#app #services .vf-wrap.in .vf::before{transform:scaleX(1)}
/* 호버 연동은 즉시 반응 */
#app #services .vn-run li{transition:color .35s ease,opacity .35s ease}
#app #services .vfx-card{transition:box-shadow .45s ease,background .45s ease,transform .45s cubic-bezier(.22,1,.36,1) !important}
#app #services .vfx-card:hover{transform:translateY(-3px) !important}
/* 결과 목록 · 결과 문장은 마지막에 천천히 */
#app #services .vf-wrap .vn-res{opacity:0;transform:translateY(10px);transition:opacity .9s ease 1.4s,transform 1s cubic-bezier(.22,1,.36,1) 1.4s}
#app #services .vf-wrap.in .vn-res{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){#app #services .vf-wrap .vfx-card,#app #services .vf-wrap .vfx-op,#app #services .vf-wrap .vn-res,#app #services .vf::before,#app #services .vfx-out::after{transition:none !important;transform:none !important;opacity:1 !important}}
/* 시나리오 탭: 선택 배경 제거 — 키컬러 진행 막대만 남김 */
#app .oa-tab,#app .oa-tab:hover,#app .oa-tab.on,#app .oa-tab:focus-visible{background:none !important;box-shadow:none !important}
#app .oa-tab{padding:18px 0 20px !important}
/* 숫자 영역 전부 가운데 정렬 — 메인 첫 화면 숫자 스타일(.hero-proof)과 동일 기준 */
#app .nx>div,#app .nx-crew>div,#app .nx-life>div,#app .nx-cert>div,#app .story-nx .nx>div{text-align:center !important;align-items:center !important;display:flex !important;flex-direction:column;justify-items:center}
#app .nx>div>b,#app .nx-crew>div>b,#app .nx-life>div>b,#app .nx-cert>div>b,#app .story-nx .nx>div>b{justify-content:center !important;align-items:flex-start !important;width:100%}
#app .nx>div>span,#app .nx-crew>div>span,#app .nx-life>div>span,#app .nx-cert>div>span,#app .story-nx .nx>div>span{text-align:center !important;display:block !important;width:100%}
#app .nx .nx-sub{text-align:center}
#app .nx-crew>div,#app .nx-life>div{padding-inline:8px}
/* 메인 첫 화면 숫자 기준: 굵기 800, 큰 숫자, 작은 단위 위쪽 정렬 */
#app .nx>div>b{font:800 var(--big)/1 var(--en) !important;letter-spacing:-.05em !important}
/* 메인 첫 화면 숫자 블록(hero-proof)도 가운데 정렬 — 단위·설명 가운데 */
#app #heroIntro .hero-proof>div{text-align:center !important;align-items:center !important;display:flex !important;flex-direction:column !important;padding-left:0 !important}
#app #heroIntro .hero-proof>div>b{justify-content:center !important;width:100%}
#app #heroIntro .hero-proof>div>span{text-align:center !important;width:100%}
/* 카드 전체 클릭: '자세히 보기' 링크를 카드 전체로 펼침(stretched link). 중첩 링크 없이 카드 어디를 눌러도 이동 */
#app .arx-c{position:relative;cursor:pointer;transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s ease}
#app .arx-go::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit}
#app .arx-c{}
#app .arx-go{position:static}
#app .arx-c:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px rgba(253,69,51,.45)}
#app .arx-c:hover .arx-go{color:#fff;box-shadow:inset 0 0 0 1px rgba(253,69,51,.7)}
#app .arx-c:focus-within{box-shadow:inset 0 0 0 1px rgba(253,69,51,.6)}
/* Life at BRIXON: 단어마다 다른 움직임 — Life 는 또렷하게 떠오름, at 은 옆에서 미끄러져 자리잡음, BRIXON. 은 형광 빛이 스치며 드러남 */
#app .abh-t .lat-w{display:inline-block;will-change:transform,opacity,filter}
#app .abh.is-in .lat-life,#app .abh-t.rv.in .lat-life,#app .rv.in .lat-life{animation:latUp 1s cubic-bezier(.22,1,.36,1) .05s both}
#app .abh.is-in .lat-at,#app .abh-t.rv.in .lat-at,#app .rv.in .lat-at{animation:latSlide 1.1s cubic-bezier(.22,1,.36,1) .28s both}
#app .abh.is-in .lat-bx,#app .abh-t.rv.in .lat-bx,#app .rv.in .lat-bx{animation:latFluor 1.6s ease .55s both}
@keyframes latUp{from{opacity:0;transform:translateY(.4em)}to{opacity:1;transform:none}}
@keyframes latSlide{from{opacity:0;transform:translateX(-.6em)}to{opacity:1;transform:none}}
@keyframes latFluor{0%{opacity:0;filter:brightness(1.5) blur(4px);color:#fff}55%{opacity:1;filter:brightness(1.6) blur(0);color:#fff}100%{opacity:1;filter:none;color:#fd4533}}
#app .lat-bx{color:#fd4533;transition:text-shadow .6s ease}
#app .abh:hover .lat-bx,#app .abh-t:hover .lat-bx{text-shadow:0 0 22px rgba(253,69,51,.45)}
@media (prefers-reduced-motion:reduce){#app .lat-w{animation:none !important;opacity:1 !important;transform:none !important;filter:none !important}}
/* About Life 숫자(40h · 90min · 3days) 가운데 정렬 — 블록과 칸 모두 */
#app #about #life .nx.nx-life,#app #life .nx.nx-life{text-align:center !important}
#app #about #life .nx.nx-life>div,#app #life .nx.nx-life>div{text-align:center !important;align-items:center !important;display:flex !important;flex-direction:column !important}
#app #about #life .nx.nx-life>div>b,#app #life .nx.nx-life>div>b{justify-content:center !important;width:100%}
#app #about #life .nx.nx-life>div>span,#app #life .nx.nx-life>div>span{text-align:center !important;width:100%}
/* 영문 슬로건(Covers. · Plan. · Free. 등) 밑 언더라인 제거 — 서비스 상세 페이지 한정 */
#app .pv2 .section-keyword::after,#app .pv2 .hl .section-keyword::after{display:none !important}
/* STUDIO 다루는 범위 = 경로 도식: 시작 → 3개 질문 정거장 → 끝. 선은 스크롤 진입 때 그어지고, 정거장은 순서대로 켜짐 */
#app .rt{position:relative;margin-top:clamp(40px,4vw,64px);display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(20px,2.6vw,40px);align-items:start}
#app .rt-start,#app .rt-end{padding-top:6px;min-width:150px}
#app .rt small{display:block;font:700 11px/1 var(--kr);letter-spacing:.06em;color:rgba(255,255,255,.5)}
#app .rt-start b,#app .rt-end b{display:block;margin-top:10px;font:800 clamp(16px,1.3vw,19px)/1.3 var(--kr);letter-spacing:-.03em;color:#fff}
#app .rt-end b{color:#fd4533}
#app .rt-stops{list-style:none;margin:0;padding:0;position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.2vw,36px)}
#app .rt-stops::before{content:"";position:absolute;left:0;right:0;top:15px;height:2px;background:rgba(255,255,255,.12);border-radius:2px}
#app .rt-stops::after{content:"";position:absolute;left:0;top:15px;height:2px;width:100%;background:linear-gradient(90deg,#fd4533,rgba(253,69,51,.55));border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform 1.4s cubic-bezier(.22,1,.36,1) .3s}
#app .rt.in .rt-stops::after{transform:scaleX(1)}
#app .rt-stop{position:relative;padding-top:0}
#app .rt-node{position:relative;z-index:1;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#121214;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.3);transition:box-shadow .6s ease,background .6s ease}
#app .rt-node em{font:700 10px/1 var(--en);font-style:normal;color:rgba(255,255,255,.7)}
#app .rt.in .rt-stop .rt-node{box-shadow:inset 0 0 0 1.5px #fd4533;background:#fd4533}
#app .rt.in .rt-stop .rt-node em{color:#fff}
#app .rt-stop:nth-child(1) .rt-node{transition-delay:.35s}
#app .rt-stop:nth-child(2) .rt-node{transition-delay:.7s}
#app .rt-stop:nth-child(3) .rt-node{transition-delay:1.05s}
#app .rt-stop small{margin-top:20px}
#app .rt-stop h4{margin:10px 0 0;font:800 clamp(18px,1.6vw,23px)/1.3 var(--kr);letter-spacing:-.04em;color:#fff}
#app .rt-out{margin:14px 0 0;display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(253,69,51,.1);box-shadow:inset 0 0 0 1px rgba(253,69,51,.4);font:600 13px/1.3 var(--kr);color:#fff}
#app .rt-out span{font:700 10.5px/1 var(--kr);color:#fd4533}
#app .rt-scope{grid-column:1/-1;margin-top:clamp(30px,3vw,44px);display:flex;align-items:center;gap:14px;padding-top:18px;border-top:1px solid rgba(255,255,255,.08)}
#app .rt-scope small{margin:0}
#app .rt-scope span{font:600 15px/1.4 var(--kr);color:rgba(255,255,255,.85)}
@media (max-width:900px){#app .rt{grid-template-columns:1fr}#app .rt-stops{grid-template-columns:1fr;gap:26px;padding-left:44px}#app .rt-stops::before,#app .rt-stops::after{left:15px;top:0;bottom:0;right:auto;width:2px;height:100%;transform-origin:top}#app .rt-stops::after{transform:scaleY(0)}#app .rt.in .rt-stops::after{transform:scaleY(1)}#app .rt-node{position:absolute;left:-44px;top:0}#app .rt-stop{padding-top:0}}
/* DESK 1단계: 질문 입력창(3초 순환) · 담당 영역 3열 · 증상 체크리스트 */
#app .desk-one{padding-top:clamp(40px,5vw,80px)}
#app .dq{position:relative}
#app .dq-l{margin:0 0 14px;font:700 13px/1 var(--kr);letter-spacing:.02em;color:rgba(255,255,255,.55)}
#app .dq-box{position:relative;display:flex;align-items:center;gap:10px;min-height:76px;padding:0 22px;border-radius:12px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);font:700 clamp(18px,1.9vw,26px)/1.3 var(--kr);letter-spacing:-.03em;color:#fff;overflow:hidden}
#app .dq-txt{transition:opacity .4s ease,transform .5s cubic-bezier(.22,1,.36,1)}
#app .dq-txt.out{opacity:0;transform:translateY(8px)}
#app .dq-cur{display:inline-block;width:2px;height:1.1em;margin-left:4px;background:#fd4533;animation:dqBlink 1s steps(1) infinite;vertical-align:middle}
@keyframes dqBlink{50%{opacity:0}}
#app .dq-dots{display:flex;gap:8px;margin-top:14px}
#app .dq-dots i{width:22px;height:2px;border-radius:2px;background:rgba(255,255,255,.18);transition:background .4s ease,width .4s ease}
#app .dq-dots i.on{background:#fd4533;width:40px}
#app .dr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,24px);margin-top:clamp(30px,3vw,44px)}
#app .dr-c{position:relative;padding:26px 24px 24px;border-radius:14px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:box-shadow .5s ease,transform .6s cubic-bezier(.22,1,.36,1)}
#app .dr-c:hover{box-shadow:inset 0 0 0 1px rgba(253,69,51,.55);transform:translateY(-3px)}
#app .dr-tag{display:inline-block;padding:6px 10px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);font:700 11px/1 var(--kr);color:rgba(255,255,255,.7)}
#app .dr-c h4{margin:18px 0 0;font:800 clamp(19px,1.6vw,23px)/1.25 var(--kr);letter-spacing:-.04em;color:#fff}
#app .dr-c p{margin:10px 0 0;font:400 15px/1.6 var(--kr);color:#999}
#app .sy{margin-top:clamp(44px,4.6vw,72px);padding-top:26px;border-top:1px solid rgba(255,255,255,.1)}
#app .sy-h{margin:0 0 18px;font:800 clamp(18px,1.5vw,22px)/1.2 var(--kr);letter-spacing:-.03em;color:#fff}
#app .sy-l{list-style:none;margin:0;padding:0;display:grid;gap:10px}
#app .sy-l li{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 18px;border-radius:12px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);transition:box-shadow .4s ease}
#app .sy-l label{display:flex;align-items:center;gap:14px;cursor:pointer;min-width:0}
#app .sy-l input{position:absolute;opacity:0;pointer-events:none}
#app .sy-box{flex:none;width:18px;height:18px;border-radius:5px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35);transition:background .3s ease,box-shadow .3s ease;position:relative}
#app .sy-l input:checked + .sy-box{background:#fd4533;box-shadow:inset 0 0 0 1.5px #fd4533}
#app .sy-l input:checked + .sy-box::after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
#app .sy-t{font:600 16px/1.4 var(--kr);color:#fff}
#app .sy-r{font:600 14px/1.3 var(--kr);color:#999;white-space:nowrap}
#app .sy-l li:has(input:checked){box-shadow:inset 0 0 0 1px rgba(253,69,51,.6)}
#app .sy-l li:has(input:checked) .sy-r{color:#fd4533}
@media (max-width:900px){#app .dr{grid-template-columns:1fr}#app .sy-l li{flex-direction:column;align-items:flex-start;gap:8px}}
/* 성장 곡선 고도화(curve-v19): 존 · 막대 · 곡선 · 노드를 정돈 — 얇은 선, 글로우는 노드에만, 존 라벨은 상단 여백에 정렬 */
#app .curve-v19 svg{overflow:visible}
#app .curve-v19 .gz rect{fill:rgba(255,255,255,.018);transition:fill .8s ease}
#app .curve-v19 .gz.lit rect{fill:rgba(253,69,51,.05)}
#app .curve-v19 .gz-div{stroke:rgba(255,255,255,.1);stroke-width:1;stroke-dasharray:2 6}
#app .curve-v19 .gz-n{font:700 13px/1 var(--en);fill:rgba(255,255,255,.4);letter-spacing:.06em;transition:fill .6s ease}
#app .curve-v19 .gz-t{font:700 15px/1 var(--kr);fill:rgba(255,255,255,.55);letter-spacing:-.02em;transition:fill .6s ease}
#app .curve-v19 .gz.lit .gz-n,#app .curve-v19 .gz.lit .gz-t{fill:#fff}
#app .curve-v19 .gb{fill:rgba(255,255,255,.08);transition:fill .8s ease}
#app .curve-v19 .gb[data-z="3"],#app .curve-v19 .gb.lit{fill:rgba(253,69,51,.32)}
#app .curve-v19 .ln{stroke-width:3 !important;filter:none !important}
#app .curve-v19 .gn-halo{fill:rgba(253,69,51,.14);transform-box:fill-box;transform-origin:center;animation:gnPulse 2.8s ease-in-out infinite}
#app .curve-v19 .gn-dot{fill:#121214;stroke:#fd4533;stroke-width:2;transition:fill .5s ease}
#app .curve-v19 .gn.lit .gn-dot{fill:#fd4533}
@keyframes gnPulse{50%{transform:scale(1.35);opacity:.4}}
#app .curve-v19 .gn{cursor:default}
#app .curve-v19 .gn:hover .gn-dot{fill:#fd4533}
#app .curve-v19 .gn-tip{opacity:0;transition:opacity .4s ease;pointer-events:none}
#app .curve-v19 .gn:hover .gn-tip{opacity:1}
@media (prefers-reduced-motion:reduce){#app .curve-v19 .gn-halo{animation:none}}
/* 성장 곡선 2차: 막대는 옅게 — 존이 켜질 때만 키컬러 농도 상승, 'AX' 배지와 존 라벨이 겹치지 않게 상단 여백 확보 */
#app .curve-v19 .gb{fill:rgba(255,255,255,.07)}
#app .curve-v19 .gb.lit{fill:rgba(253,69,51,.22)}
#app .curve-v19 .gb[data-z="3"].lit{fill:rgba(253,69,51,.38)}
#app .curve-v19 .gb[data-z="3"]{fill:rgba(253,69,51,.12)}
#app .curve-v19 .gz.lit rect{fill:rgba(253,69,51,.035)}
#app .curve-v19 svg{margin-top:12px}
#app .curve-v19 .gz-t,#app .curve-v19 .gz-n{transform:translateY(0)}
@media (max-width:820px){#app .curve-v19 svg{margin-top:0}#app .curve-v19 .gz-t{font-size:12px}}
/* 활성 알약(rfx-tab.on)의 빛이 잘리지 않게: 탭 줄(overflow-x:auto)에 여백을 주고, 같은 만큼 음수 margin으로 레이아웃은 그대로 */
#app .rfx-tabs{padding:16px 28px 38px !important;margin:-16px -28px -38px !important;scroll-padding-inline:28px}
@media (max-width:820px){#app .rfx-tabs{padding:16px var(--pad) 38px !important;margin:-16px calc(var(--pad) * -1) -38px !important}}
/* 예시 화면(.rfx-shot 안의 모든 목업)은 화이트 배경 · 진한 글자로 — 가독성 우선. 바깥 섹션은 그대로 어둡게 */
#app .rfx-shot>.glass,#app .rfx-shot .rfm.glass{background:#fff !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.1),0 24px 50px -28px rgba(0,0,0,.6) !important;border-radius:16px !important;color:#111}
#app .rfx-shot .rfm-url{border-bottom-color:rgba(0,0,0,.1);background:#f4f4f6}
#app .rfx-shot .rfm-url i{background:rgba(0,0,0,.2)}
#app .rfx-shot .rfm-url span{background:#fff;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
#app .rfx-shot .rfm-top{border-bottom-color:rgba(0,0,0,.1)}
#app .rfx-shot .rfm-top b{color:#111}
#app .rfx-shot .rfm-top span,#app .rfx-shot .rfm-th,#app .rfx-shot .rfm-agent small{color:#555}
#app .rfx-shot .rfm-dots{background:radial-gradient(circle,#fd4533 1.6px,transparent 2.2px) -5.5px -5.5px/66px 22px,radial-gradient(circle,rgba(0,0,0,.28) 1.6px,transparent 2.2px) 0 0/11px 11px}
#app .rfx-shot .rfm-bars b{color:#222}
#app .rfx-shot .rfm-bars i{background:rgba(0,0,0,.08)}
#app .rfx-shot .rfm-bars i::after{background:rgba(0,0,0,.42)}
#app .rfx-shot .rfm-bars .is-top b{color:#111}
#app .rfx-shot .rfm-bars .is-top i::after{background:#fd4533}
#app .rfx-shot .rfm-bars em{color:#e0301f}
#app .rfx-shot .rfm-line{border-top-color:rgba(0,0,0,.1)}
#app .rfx-shot .rfm-line b{color:#555}
#app .rfx-shot .rfm-line p{color:#222}
#app .rfx-shot .rfm-line.is-key p{color:#000;font-weight:700}
#app .rfx-shot .rfm-sk{border-right-color:rgba(0,0,0,.1)}
#app .rfx-shot .rfm-sk p{background:linear-gradient(150deg,rgba(253,69,51,.16),rgba(0,0,0,.03) 70%);color:#111}
#app .rfx-shot .rfm-sk i{background:rgba(0,0,0,.06)}
#app .rfx-shot .rfm-sk i.is-rec{box-shadow:inset 0 0 0 2px #fd4533}
#app .rfx-shot .rfm-b{color:#111;font-weight:600}
#app .rfx-shot .rfm-b.u{background:#111;color:#fff}
#app .rfx-shot .rfm-b.a{background:#f1f1f4;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);color:#111}
#app .rfx-shot .rfm-recs i{box-shadow:inset 0 0 0 1.5px #fd4533;color:#111;background:#fff}
#app .rfx-shot .rfm-card{background:#fff !important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14) !important}
#app .rfx-shot .rfm-card b{color:#e0301f}
#app .rfx-shot .rfm-card p{color:#111}
#app .rfx-shot .rfm-card div span{box-shadow:inset 0 0 0 1px rgba(0,0,0,.22);color:#333}
#app .rfx-shot .rfm-card div .is-ok{background:#fd4533;color:#fff;box-shadow:none}
#app .rfx-shot .rfm-site .rfm-sk{background:#fff}
#app .rfx .chat .rfm-card{background:#fff}
/* 예시 화면 안의 라벨 · 줄 글자는 화이트 배경에서 읽히도록 !important (앞선 흰색 강제 규칙을 이김) */
#app .rfx-shot .rfm-bars b,#app .rfx-shot .rfm-line b,#app .rfx-shot .rfm-th,#app .rfx-shot .rfm-top span,#app .rfx-shot .rfm-agent small{color:#333 !important}
#app .rfx-shot .rfm-line p,#app .rfx-shot .rfm-sk p,#app .rfx-shot .rfm-card p{color:#111 !important}
#app .rfx-shot .rfm-line.is-key p{color:#000 !important}
#app .rfx-shot .rfm-b.a{color:#111 !important}
#app .rfx-shot .rfm-b.u{color:#fff !important}
#app .rfx-shot .rfm-recs i{color:#111 !important}
#app .rfx-shot .rfm-card div span{color:#333 !important}
/* GROWTH 가격표: 밝은 패널 + 흰 카드. 미대행(구독료) ↔ 광고대행(FREE) 토글은 체크박스 :checked로 */
#app .ads-price{position:relative;margin-top:clamp(28px,3vw,44px);padding:clamp(28px,3vw,44px);border-radius:22px;background:#f1f2f5;color:#111}
#app .ads-in{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
#app .ads-sw{display:inline-flex;align-items:center;gap:12px;cursor:pointer;font:600 15px/1 var(--kr);color:#8a8d94;user-select:none}
#app .ads-sw .ads-l0,#app .ads-sw .ads-l1{transition:color .35s ease}
#app .ads-track{position:relative;display:block;width:76px;height:42px;border-radius:999px;background:#fd4533;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
#app .ads-knob{position:absolute;top:4px;left:4px;width:34px;height:34px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.18);transition:transform .45s cubic-bezier(.22,1,.36,1)}
#app .ads-free-tag{font:700 13px/1 var(--en);font-style:normal;padding:8px 12px;border-radius:999px;background:#fff;color:#fd4533}
#app .ads-in:not(:checked) ~ .ads-sw .ads-l0,#app .ads-in:checked ~ .ads-sw .ads-l1{color:#111}
#app .ads-in:checked ~ .ads-sw .ads-knob{transform:translateX(34px)}
#app .ads-in:focus-visible ~ .ads-sw{outline:2px solid #111;outline-offset:4px;border-radius:8px}
#app .ads-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px);margin-top:clamp(24px,2.6vw,36px);align-items:stretch}
#app .ads-card{position:relative;display:flex;flex-direction:column;padding:clamp(26px,2.4vw,36px);border-radius:18px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.04)}
#app .ads-card.is-key{box-shadow:0 18px 40px -22px rgba(0,0,0,.22)}
#app .ads-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-height:30px}
#app .ads-top h3{margin:0;font:700 clamp(22px,1.9vw,26px)/1.2 var(--en);letter-spacing:-.01em;color:#111}
#app .ads-badge{padding:6px 11px;border-radius:999px;background:#fff1ee;color:#fd4533;font:700 12.5px/1 var(--en)}
#app .ads-card.is-dark .ads-badge,#app .ads-card.is-dark .ads-top .ads-badge{background:#111;color:#fff}
#app .ads-corner{position:absolute;top:22px;right:22px;width:14px;height:14px;border-top:2px solid #fd4533;border-right:2px solid #fd4533}
#app .ads-pr{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:26px 0 0}
#app .ads-pr s{font:600 17px/1 var(--en);color:#b4b7bd}
#app .ads-pr b{font:800 clamp(38px,3.4vw,50px)/1 var(--en);letter-spacing:-.03em;color:#111}
#app .ads-pr small{font:500 15px/1 var(--en);color:#8a8d94}
#app .ads-agency{display:none}
#app .ads-in:checked ~ .ads-cards .ads-agency{display:inline}
#app .ads-in:checked ~ .ads-cards .ads-direct{display:none}
#app .ads-in:checked ~ .ads-cards .ads-pr b{color:#fd4533}
#app .ads-tag{margin:14px 0 0;font:500 15px/1.5 var(--kr);color:#55585f}
#app .ads-cta{margin-top:22px;width:100%;padding:18px 20px;border:0;border-radius:999px;background:#fff;color:#111;font:700 17px/1 var(--en);box-shadow:inset 0 0 0 1px rgba(0,0,0,.14);cursor:pointer;transition:background-color .35s ease,color .35s ease}
#app .ads-cta:hover{background:#111;color:#fff}
#app .ads-card.is-key .ads-cta{background:#fd4533;color:#fff;box-shadow:none}
#app .ads-card.is-key .ads-cta:hover{background:#111}
#app .ads-h{margin:28px 0 12px;font:700 14px/1 var(--kr);color:#111}
#app .ads-card ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
#app .ads-card li{position:relative;padding-left:22px;font:500 14px/1.6 var(--kr);color:#55585f;text-wrap:pretty}
#app .ads-card li::before{content:"";position:absolute;left:0;top:.5em;width:9px;height:9px;border-top:2px solid #fd4533;border-left:2px solid #fd4533}
#app .ads-note{margin:22px 0 0;font:500 13.5px/1.5 var(--kr);color:#8a8d94}
@media (max-width:900px){#app .ads-cards{grid-template-columns:minmax(0,1fr)}}
/* 가격표 글자: 전역 흰색 규칙을 이기고 밝은 패널에서 읽히게 */
#app .ads-price h3,#app .ads-price .ads-top h3{color:#111 !important}
#app .ads-price .ads-pr b,#app .ads-price .ads-direct b,#app .ads-price .ads-agency b{color:#111 !important}
#app .ads-price .ads-in:checked ~ .ads-cards .ads-pr b{color:#fd4533 !important}
#app .ads-price .ads-pr s{color:#b4b7bd !important}
#app .ads-price .ads-pr small{color:#8a8d94 !important}
#app .ads-price .ads-tag{color:#55585f !important}
#app .ads-price .ads-h{color:#111 !important}
#app .ads-price .ads-card li{color:#55585f !important}
#app .ads-price .ads-note{color:#8a8d94 !important}
#app .ads-price .ads-sw,#app .ads-price .ads-sw span{color:#8a8d94 !important}
#app .ads-price .ads-in:not(:checked) ~ .ads-sw .ads-l0,#app .ads-price .ads-in:checked ~ .ads-sw .ads-l1{color:#111 !important}
#app .ads-price .ads-free-tag{color:#fd4533 !important;background:#fff !important}
#app .ads-price .ads-badge{color:#fd4533 !important}
#app .ads-price .ads-card.is-dark .ads-badge{color:#fff !important}
#app .ads-price .ads-cta{text-transform:none !important;color:#111 !important}
#app .ads-price .ads-card.is-key .ads-cta{color:#fff !important}
#app .ads-price .ads-cta:hover{color:#fff !important}
#app .ads-price .ads-card.is-dark .ads-cta{color:#111 !important}
#app .ads-price .ads-cta,#app .ads-price .ads-pr small,#app .ads-price .ads-cta *{text-transform:none !important}
/* 서비스 히어로 서브 슬로건(p.d): About 브랜드 노트의 서브 슬로건 규격과 통일 — 세 서비스 공통 */
#app .pv3 p.d,#app .pv3-hero p.d{margin:0;font:500 clamp(19px,1.9vw,28px)/1.7 var(--kr) !important;letter-spacing:-.04em !important;color:#f3f3f3 !important;word-break:keep-all;text-wrap:pretty}
#app .pv3 p.d b,#app .pv3-hero p.d b{font-weight:800 !important;color:#fff !important}
/* Process 카드: v4 불규칙 배치 · 정사각 그대로(기울기 · 겹침 없음) + 더 투명한 유리 · 카드 뒤 빛 번짐. 모바일은 그대로 */
@media (min-width:1101px){
 #app #process .ps-journey .ps-card:nth-child(n),#app #process .ps-journey .ps-card:nth-child(n):hover{
  background:linear-gradient(160deg,rgba(255,255,255,.08) 0%,rgba(255,255,255,.015) 100%) !important;
  -webkit-backdrop-filter:blur(16px) saturate(1.5) !important;backdrop-filter:blur(16px) saturate(1.5) !important;
  border:1px solid rgba(255,255,255,.14) !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset -40px -40px 80px -60px rgba(253,69,51,.10),0 30px 60px -40px rgba(0,0,0,.7) !important}
 /* 카드 뒤 흐릿한 빛 덩어리 — 유리 너머로 번져 보이게, 섹션 가장자리에서 잘리지 않도록 크기 제한 */
 #app #process .ps-journey::after{content:"";position:absolute;left:8%;right:8%;top:10%;bottom:8%;pointer-events:none;z-index:0;
  background:radial-gradient(closest-side at 30% 40%,rgba(253,69,51,.10),transparent 70%),radial-gradient(closest-side at 72% 62%,rgba(255,196,150,.07),transparent 70%)}
 #app #process .ps-journey .ps-list{position:relative;z-index:1}
}
/* 기술 스택 줄(100% 풀폭)의 타이틀 라벨도 풀폭 영역의 왼쪽 마진(--pad)에 맞춤 — 컨테이너 1296px 기준에서 벗어나지 않게 */
#app #about .ts-lab{padding-inline:clamp(24px,5vw,80px) !important}
/* 단어 활성화 시 오른쪽으로 밀리지 않게 — 원래 자리에서 색만 바뀜 */
#app .hw-words li.on,#app .hw-words li.on:hover{transform:none !important}
/* AX STUDIO 스펙(ax_studio.md) 반영 */
#app .sx-morph{position:relative;min-height:1.3em;margin:0 0 18px;font:700 13px/1.3 var(--en);letter-spacing:.16em;color:#fd4533}
#app .sx-morph span{position:absolute;left:0;top:0;white-space:nowrap;opacity:0;animation:sxMorph 9s linear infinite}
#app .sx-morph span:nth-child(2){animation-delay:3s}
#app .sx-morph span:nth-child(3){animation-delay:6s}
@keyframes sxMorph{0%{opacity:0;transform:translateY(6px)}6%,30%{opacity:1;transform:none}36%,100%{opacity:0;transform:translateY(-6px)}}
@media (prefers-reduced-motion:reduce){#app .sx-morph span{animation:none}#app .sx-morph span:first-child{opacity:1}}
#app .sx-cta{margin-top:clamp(48px,5vw,72px);padding:clamp(40px,4vw,64px) clamp(24px,4vw,56px);border-radius:20px;text-align:center;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.01));box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .sx-cta p{margin:0 0 28px;font:600 clamp(20px,2vw,28px)/1.5 var(--kr);letter-spacing:-.03em;color:#f3f3f3;word-break:keep-all}
#app .sx-cta p b{color:#fd4533;font-weight:800}
/* ===== AX DESK 2·3단계 ===== */
/* ③ 사례 탐색기: 데스크톱은 왼쪽 질문 목록(고정) + 오른쪽 사례 패널, 폰은 가로 칩 그대로 */
#app .rfx-tq{display:none}
#app .rfx-tab.is-hint{box-shadow:inset 0 0 0 1.5px #fd4533 !important}
#app .rfx-tab.is-hint:not(.on)::after{content:"";width:6px;height:6px;border-radius:50%;background:#fd4533;margin-left:4px}
@media (min-width:1101px){
 #app #desk-cases .rfx{grid-template-columns:300px minmax(0,1fr);grid-template-areas:"tabs stage" "nav stage";align-items:start;column-gap:clamp(28px,3vw,48px)}
 #app #desk-cases .rfx-tabs{flex-direction:column;gap:6px;overflow:visible !important;margin:0 !important;padding:0 !important;position:sticky;top:110px;align-self:start}
 #app #desk-cases .rfx-tab{height:auto;flex-wrap:wrap;align-items:flex-start;row-gap:6px;padding:14px 16px;border-radius:12px;white-space:normal;background:transparent;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
 #app #desk-cases .rfx-tab .rfx-tn{font:700 15px/1.2 var(--kr);letter-spacing:-.02em}
 #app #desk-cases .rfx-tq{display:block;flex-basis:100%;font:500 13px/1.5 var(--kr);letter-spacing:-.02em;color:rgba(255,255,255,.55);text-wrap:pretty}
 #app #desk-cases .rfx-tab.on{background:#fd4533;box-shadow:0 12px 28px -14px rgba(253,69,51,.8)}
 #app #desk-cases .rfx-tab.on .rfx-tq{color:rgba(255,255,255,.88)}
 #app #desk-cases .rfx-tab:not(.on):hover{background:rgba(255,255,255,.05)}
 #app #desk-cases .rfx-nav{grid-area:nav;justify-content:flex-start;margin-top:18px}
 #app #desk-cases .rfx-stage{margin-top:0;padding-top:0;background:none}
 #app #desk-cases .rfx-panel{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "shot" "body";row-gap:24px}
 #app #desk-cases .rfx-shot{justify-self:stretch;max-width:none}
}
/* ④ 믿고 맡길 수 있는 이유 */
#app .dt-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,20px);margin-top:clamp(28px,3vw,44px)}
#app .dt-c{position:relative;padding:26px 24px 24px;border-radius:14px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .dt-c::before{content:"";position:absolute;left:24px;right:24px;top:0;height:2px;border-radius:2px;background:var(--dt,#fff)}
#app .dt-now{--dt:rgba(255,255,255,.75)}#app .dt-ask{--dt:#fd4533}#app .dt-human{--dt:rgba(255,255,255,.28)}
#app .dt-k{display:flex;align-items:center;gap:8px;margin:0 0 12px;font:600 13px/1 var(--kr);color:rgba(255,255,255,.6)}
#app .dt-k i{width:8px;height:8px;border-radius:50%;background:var(--dt)}
#app .dt-c h4{margin:0 0 14px;font:800 clamp(20px,1.7vw,24px)/1.25 var(--kr);letter-spacing:-.03em;color:#fff}
#app .dt-c ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
#app .dt-c li{font:500 15px/1.5 var(--kr);color:rgba(255,255,255,.75)}
#app .dt-flow{position:relative;list-style:none;margin:clamp(36px,4vw,56px) 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
#app .dt-flow::before{content:"";position:absolute;left:18px;right:18px;top:17px;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.2),#fd4533)}
#app .dt-flow li{position:relative;display:grid;gap:6px;justify-items:start}
#app .dt-n{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#0e0e10;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);font:700 12px/1 var(--en);color:#fff;margin-bottom:8px}
#app .dt-flow li:nth-child(4) .dt-n,#app .dt-flow li:nth-child(5) .dt-n{box-shadow:inset 0 0 0 1px #fd4533;color:#fd4533}
#app .dt-flow b{font:700 16px/1.3 var(--kr);color:#fff}
#app .dt-flow small{font:500 13.5px/1.5 var(--kr);color:rgba(255,255,255,.6);text-wrap:pretty}
#app .dt-note{margin:clamp(28px,3vw,40px) 0 0;font:500 15px/1.6 var(--kr);color:rgba(255,255,255,.7)}
#app .dt-note b{margin-right:12px;color:#fd4533;font-weight:700}
/* ⑤ 증상으로 찾기(독립 블록) */
#app .desk-sym .sy{margin-top:0;padding-top:0;border-top:0}
#app .sy-case{margin-left:10px;color:#fd4533;text-decoration:none;font-weight:700;white-space:nowrap}
#app .sy-case:hover{color:#fff}
#app .sy-sel{min-height:1.5em;margin:14px 0 0;font:500 14px/1.5 var(--kr);color:rgba(255,255,255,.7)}
/* ⑥ 다음 칸 */
#app .dn-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;margin-top:clamp(28px,3vw,44px)}
#app .dn-c{position:relative;display:flex;flex-direction:column;gap:10px;min-height:230px;padding:18px 16px;border-radius:14px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);text-decoration:none;color:#fff;transition:box-shadow .5s ease,transform .6s cubic-bezier(.22,1,.36,1)}
#app .dn-c:hover{box-shadow:inset 0 0 0 1px rgba(253,69,51,.55);transform:translateY(-3px)}
#app .dn-n{font:700 12px/1 var(--en);letter-spacing:.08em;color:#fd4533}
#app .dn-c b{font:800 16px/1.3 var(--kr);letter-spacing:-.02em}
#app .dn-c small{font:500 13px/1.5 var(--kr);color:rgba(255,255,255,.6);text-wrap:pretty}
#app .dn-empty{background:transparent;box-shadow:none;outline:1.5px dashed rgba(255,255,255,.32);outline-offset:-1.5px}
#app .dn-empty:hover{outline-color:#fd4533;box-shadow:none}
#app .dn-q{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
#app .dn-q i{font:600 12px/1 var(--kr);font-style:normal;padding:6px 9px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);color:rgba(255,255,255,.8)}
#app .dn-go{font:700 13px/1 var(--kr);font-style:normal;color:#fd4533}
#app .dn-empty.is-done{outline:1.5px solid #fd4533}
@media (max-width:1279px){#app .dn-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:640px){#app .dn-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#app .dn-c{min-height:180px}}
/* ⑧ 질문 남기기 */
#app .da-f{margin-top:clamp(28px,3vw,44px);display:grid;gap:14px}
#app .da-f input{box-sizing:border-box;width:100%;border:0;outline:0;border-radius:12px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);color:#fff;font:500 16px/1.4 var(--kr);transition:box-shadow .35s ease}
#app .da-f input:focus{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.55)}
#app .da-f input.err{box-shadow:inset 0 0 0 1.5px #fd4533}
#app .da-q input{height:76px;padding:0 22px;font-size:clamp(17px,1.4vw,20px)}
#app .da-f input::placeholder{color:rgba(255,255,255,.35)}
#app .da-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:14px;align-items:end}
#app .da-row label{display:grid;gap:8px}
#app .da-row small{font:500 13px/1 var(--kr);color:rgba(255,255,255,.6)}
#app .da-row input{height:54px;padding:0 16px}
#app .da-row .btn{height:54px}
#app .da-f .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
#app .da-msg{min-height:1.5em;margin:0;font:500 14px/1.5 var(--kr);color:rgba(255,255,255,.75)}
@media (max-width:820px){#app .da-row{grid-template-columns:minmax(0,1fr)}#app .dt-cols{grid-template-columns:minmax(0,1fr)}#app .dt-flow{grid-template-columns:minmax(0,1fr);gap:18px}#app .dt-flow::before{left:17px;right:auto;top:18px;bottom:18px;width:1px;height:auto;background:linear-gradient(180deg,rgba(255,255,255,.2),#fd4533)}#app .dt-flow li{grid-template-columns:36px 1fr;column-gap:14px;align-items:center}#app .dt-n{grid-row:1/3;margin:0}}
/* ===== AX GROWTH 1~3단계 ===== */
#app .gf{margin-top:clamp(28px,3vw,44px)}
#app .gf-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;align-items:end}
#app .gf-col{display:flex;flex-direction:column;gap:12px}
#app .gf-m{margin:0;font:500 13px/1.4 var(--kr);color:rgba(255,255,255,.55)}
#app .gf-bar{display:flex;flex-direction:column;gap:6px;height:calc(var(--h) * 2.6px);min-height:72px;padding:16px;border-radius:12px 12px 0 0;box-sizing:border-box;background:linear-gradient(180deg,rgba(253,69,51,.2),rgba(253,69,51,.03));box-shadow:inset 0 1px 0 rgba(253,69,51,.5),inset 0 0 0 1px rgba(255,255,255,.08)}
#app .gf-bar b{font:800 18px/1 var(--kr);color:#fff}
#app .gf-bar small{font:500 13px/1 var(--kr);color:rgba(255,255,255,.6)}
#app .gf-drops{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}
#app .gf-d{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:8px;padding:18px;border-radius:12px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:box-shadow .4s ease}
#app .gf-d:hover{box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
#app .gf-d.on{box-shadow:inset 0 0 0 1.5px #fd4533}
#app .gf-d:focus-visible{outline:2px solid #fff;outline-offset:3px}
#app .gf-dk{font:700 13px/1 var(--kr);color:#fd4533}
#app .gf-dh{font:500 14px/1.4 var(--kr);color:rgba(255,255,255,.55)}
#app .gf-dx{display:none;flex-direction:column;gap:6px}
#app .gf-dx b{font:700 15px/1.5 var(--kr);color:#fff}
#app .gf-dx small{font:500 14px/1.5 var(--kr);color:rgba(255,255,255,.7)}
#app .gf-d.on .gf-dh{display:none}#app .gf-d.on .gf-dx{display:flex}
#app .gc{margin-top:clamp(28px,3vw,40px)}
#app .gc-h,#app .gq-h,#app .gk-h,#app .gm-h,#app .gy-h{margin:0 0 14px;font:700 15px/1.3 var(--kr);color:#fff}
#app .gc-h small{margin-left:8px;font:500 12px/1 var(--kr);color:rgba(255,255,255,.45)}
#app .gc-l{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
#app .gc-l li{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:999px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .gc-l b{font:600 14px/1 var(--kr);color:#fff}
#app .gc-l span{display:flex;align-items:center;gap:6px;font:500 13px/1 var(--kr);color:rgba(255,255,255,.55)}
#app .gc-l i{width:8px;height:8px;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.45)}
#app .gc-l .is-on span{color:#fd4533}#app .gc-l .is-on i{background:#fd4533;box-shadow:none}
#app .gq{margin-top:clamp(40px,4.4vw,64px)}
#app .gq-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#app .gq-c{padding:20px;border-radius:12px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .gq-c small{display:block;margin-bottom:10px;font:600 12.5px/1.4 var(--kr);color:#fd4533}
#app .gq-c p{margin:0;font:600 16px/1.5 var(--kr);letter-spacing:-.02em;color:#fff;text-wrap:pretty}
#app .gd-flow{list-style:none;margin:clamp(28px,3vw,44px) 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
#app .gd-flow li{display:grid;gap:6px;padding-top:16px;border-top:2px solid rgba(253,69,51,calc(.35 + var(--i) * .16))}
#app .gd-n{font:700 12px/1 var(--en);color:#fd4533}
#app .gd-flow b{font:800 18px/1.3 var(--kr);color:#fff}
#app .gd-flow small{font:500 14px/1.5 var(--kr);color:rgba(255,255,255,.6)}
#app .ga{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:start;margin-top:clamp(36px,4vw,56px)}
#app .ga-card{padding:18px;border-radius:18px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 30px 60px -40px rgba(0,0,0,.8)}
#app .ga-top{display:flex;justify-content:space-between;align-items:center;margin:0 0 12px;font:600 13px/1 var(--kr);color:rgba(255,255,255,.6)}
#app .ga-top em{font-style:normal;padding:5px 9px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);font-size:12px}
#app .ga-in{padding:16px;border-radius:12px;background:rgba(255,255,255,.04)}
#app .ga-in b{display:block;font:700 15px/1.4 var(--kr);color:#fff}
#app .ga-in p{margin:6px 0 2px;font:500 14px/1.4 var(--kr);color:rgba(255,255,255,.85)}
#app .ga-in small{font:500 13px/1.4 var(--kr);color:#fd4533}
#app .ga-btn{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
#app .ga-btn span{display:grid;place-items:center;height:40px;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);font:700 14px/1 var(--kr);color:#fff}
#app .ga-btn .is-ok{background:#fd4533;box-shadow:none}
#app .ga-foot{margin:10px 0 0;padding:12px 14px;border-radius:10px;background:rgba(255,255,255,.04);font:500 13.5px/1.5 var(--kr);color:rgba(255,255,255,.75)}
#app .ga-rh{margin:0 0 6px;font:700 15px/1.3 var(--kr);color:#fff}
#app .ga-rh span{margin-left:10px;font:500 13px/1 var(--kr);color:rgba(255,255,255,.5)}
#app .ga-rules ul{list-style:none;margin:0;padding:0}
#app .ga-rules li{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.08)}
#app .ga-rules li span{font:500 15px/1.5 var(--kr);color:rgba(255,255,255,.7)}
#app .ga-rules li b{flex:none;font:700 15px/1.5 var(--kr);color:#fff}
#app .gk{margin-top:clamp(40px,4.4vw,64px)}
#app .gk-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
#app .gk-c{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:20px;border-radius:12px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .gk-c small{font:500 14px/1.3 var(--kr);color:rgba(255,255,255,.65)}
#app .gk-c b{font:700 32px/1 var(--en);color:#fff}
#app .gk-t{padding:5px 10px;border-radius:999px;font:600 12px/1 var(--kr)}
#app .gk-obs{color:#fd4533;box-shadow:inset 0 0 0 1px #fd4533}
#app .gk-asm{color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.55)}
#app .gk-none{color:rgba(255,255,255,.5);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
#app .gk-note{margin:12px 0 0;font:500 13px/1.5 var(--kr);color:rgba(255,255,255,.5)}
#app .gs{margin-top:clamp(28px,3vw,44px)}
#app .gs-tabs{display:flex;gap:8px;margin-bottom:12px}
#app .gs-tabs span{padding:8px 14px;border-radius:999px;font:700 13px/1 var(--kr);color:#fff;box-shadow:inset 0 0 0 1.5px #fd4533}
#app .gs-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-radius:14px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);background:#17171a}
#app .gs-row>div{padding:20px;display:flex;flex-direction:column;gap:10px}
#app .gs-row>div+div{box-shadow:inset 1px 0 0 rgba(255,255,255,.08)}
#app .gs-row small{font:600 12.5px/1 var(--kr);color:rgba(255,255,255,.5)}
#app .gs-row p{margin:0;font:600 15.5px/1.5 var(--kr);color:#fff;text-wrap:pretty}
#app .gs-rx{background:rgba(253,69,51,.07)}
#app .gs-bars{display:flex;align-items:flex-end;gap:14px;height:96px;padding-top:18px}
#app .gs-bars span{position:relative;width:40px;height:calc(var(--v) * 1.9px);border-radius:6px 6px 0 0;background:rgba(255,255,255,.22)}
#app .gs-bars .is-up{background:#fd4533}
#app .gs-bars em{position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);font:700 13px/1 var(--en);font-style:normal;color:#fff;white-space:nowrap}
#app .gs-src{margin:12px 0 0;font:500 13px/1.5 var(--kr);color:rgba(255,255,255,.5)}
#app .gm{margin-top:clamp(40px,4.4vw,64px)}
#app .gm-l{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:10px}
#app .gm-l li{padding:12px 16px;border-radius:999px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);font:500 14.5px/1 var(--kr);color:rgba(255,255,255,.8)}
#app .gm-l li b{color:#fff;font-weight:700}
#app .gm-l li+li:not(.gm-gap)::before{content:"→";margin-right:10px;color:#fd4533}
#app .gm-l .gm-gap{margin-left:clamp(12px,2vw,32px)}
#app .gy{margin-top:clamp(40px,4.4vw,64px)}
#app .gy-l{list-style:none;margin:0;padding:0}
#app .gy-l li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:baseline;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.08)}
#app .gy-l span{font:500 16px/1.5 var(--kr);color:rgba(255,255,255,.7)}
#app .gy-l b{font:700 16px/1.5 var(--kr);color:#fff}
#app .gy-l b::before{content:"→ ";color:#fd4533}
#app .gt{padding:clamp(40px,4vw,64px) clamp(24px,4vw,56px);border-radius:20px;text-align:center;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.01));box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .gt-h{margin:0 0 22px;font:700 clamp(22px,2.2vw,30px)/1.4 var(--kr);letter-spacing:-.03em;color:#f3f3f3}
#app .gt-steps{list-style:none;margin:0 0 28px;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
#app .gt-steps li{display:flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);font:600 15px/1 var(--kr);color:#fff}
#app .gt-steps span{color:#fd4533}
#app .gt-acts{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:18px}
#app .gt-sub{all:unset;cursor:pointer;font:600 15px/1 var(--kr);color:rgba(255,255,255,.7);transition:color .35s ease}
#app .gt-sub:hover,#app .gt-sub:focus-visible{color:#fff}
@media (max-width:900px){#app .gf-cols{grid-template-columns:repeat(2,minmax(0,1fr))}#app .gf-drops,#app .gq-grid,#app .gd-flow,#app .ga,#app .gs-row{grid-template-columns:minmax(0,1fr)}#app .gk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#app .gs-row>div+div{box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}#app .gy-l li{grid-template-columns:minmax(0,1fr)}}
/* 증상 목록(ul.sy-l)이 벤다이어그램 선(.sy-l, SVG) 전역 규칙 opacity:0에 걸려 안 보이던 문제 — 목록만 보이게 */
#app ul.sy-l{opacity:1 !important;fill:none}
/* 사례 탐색기(데스크톱): 왼쪽 질문 목록이 내비게이션이라 아래 화살표는 숨김(고정 목록과 겹치지 않게) */
@media (min-width:1101px){#app #desk-cases .rfx-nav{display:none}}
#app ul.sy-l .sy-t{position:static !important;transform:none !important;display:inline !important;text-align:left !important;opacity:1 !important}
#app .pair-one a{white-space:nowrap}
@media (max-width:900px){#app .gf-bar{height:calc(var(--h) * 1.5px);min-height:64px}}
/* 서비스 히어로 위계: 영문 슬로건 → 국문 헤드라인 → 본문 순. 본문은 본문 크기로 내리고 흐리게, 강조 구절만 흰색 */
#app .pv3 p.d,#app .pv3-hero p.d{font:400 clamp(17px,1.3vw,20px)/1.8 var(--kr) !important;letter-spacing:-.025em !important;color:rgba(255,255,255,.66) !important}
#app .pv3 p.d b,#app .pv3-hero p.d b{font-weight:700 !important;color:#fff !important}
/* ===== AX STUDIO 정의서 레이아웃 ===== */
/* 02 페인: 좌 목록 · 우 와이어프레임(스크롤 진행 --p 0→1로 흩어짐 → 정렬) */
#app .sx-pain{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,96px);align-items:start;margin-top:clamp(28px,3vw,44px)}
#app .sx-pl{list-style:none;margin:0;padding:0;display:grid;gap:clamp(28px,3vw,44px)}
#app .sx-pl li{display:grid;grid-template-columns:44px 1fr;column-gap:12px;row-gap:10px}
#app .sx-pl .n{grid-row:1/3;font:700 13px/1.6 var(--en);color:#fd4533}
#app .sx-pl b{font:800 clamp(22px,2vw,30px)/1.3 var(--kr);letter-spacing:-.035em;color:#fff}
#app .sx-pl p{margin:0;font:400 clamp(16px,1.2vw,18px)/1.7 var(--kr);color:rgba(255,255,255,.66)}
#app .sx-pl p b{font-size:inherit;font-weight:700;letter-spacing:inherit;color:#fff}
#app .sx-wire{position:sticky;top:120px;--p:0}
#app .sx-wf{position:relative;aspect-ratio:4/3;border-radius:16px;background:#181818;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .sx-b{position:absolute;border-radius:6px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);
 transform:translate(calc(var(--x) * (1 - var(--p)) * 1px),calc(var(--y) * (1 - var(--p)) * 1px)) rotate(calc(var(--r) * (1 - var(--p)) * 1deg));opacity:calc(.45 + var(--p) * .55);will-change:transform}
#app .sx-btn{background:#fd4533;box-shadow:none}
#app .sx-img{background:linear-gradient(150deg,rgba(253,69,51,.25),rgba(255,255,255,.04) 70%)}
#app .sx-wcap{display:flex;justify-content:space-between;margin:14px 2px 0;font:600 13px/1 var(--kr)}
#app .sx-wcap .a{color:rgba(255,255,255,calc(.7 - var(--p) * .5))}
#app .sx-wcap .b{color:rgba(253,69,51,calc(.3 + var(--p) * .7))}
/* 03 Plan First: 블루프린트 4단 + 호버 시 산출물 패널 */
#app .sx-doc>li{position:relative;cursor:default;outline:none}
#app .sx-out{margin-top:18px;padding:16px;border-radius:12px;background:rgba(24,24,24,.72);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
 opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .6s cubic-bezier(.22,1,.36,1)}
#app .sx-doc>li:hover .sx-out,#app .sx-doc>li:focus-visible .sx-out,#app .sx-doc>li:focus-within .sx-out{opacity:1;transform:none}
#app .sx-ok{display:block;margin-bottom:10px;font:700 11px/1 var(--en);letter-spacing:.14em;color:#fd4533}
#app .sx-tree{list-style:none;margin:0;padding:0 0 0 10px;display:grid;gap:8px;border-left:1px solid rgba(253,69,51,.5)}
#app .sx-tree li{position:relative;display:flex;align-items:center;gap:8px;font:600 13.5px/1.3 var(--kr);color:#fff}
#app .sx-tree i{width:10px;height:1px;margin-left:-10px;background:rgba(253,69,51,.5)}
@media (hover:none){#app .sx-out{opacity:1;transform:none}}
/* 04 What It Covers: 1 → 3 → 9 확장 도식 */
#app .sx-cap{margin-top:clamp(28px,3vw,44px)}
#app .sx-ch,#app .sx-outs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
#app .sx-ch>div{display:grid;gap:6px;justify-items:center;text-align:center}
#app .sx-ch em{font:700 12px/1 var(--en);font-style:normal;color:#fd4533}
#app .sx-ch b{font:800 clamp(18px,1.6vw,22px)/1.3 var(--kr);letter-spacing:-.03em;color:#fff}
#app .sx-ch span{font:500 14.5px/1.5 var(--kr);color:rgba(255,255,255,.62)}
#app .sx-svg{display:block;width:100%;height:auto;margin:18px 0}
#app .sx-svg path{fill:none;stroke:rgba(253,69,51,.55);stroke-width:1.4;stroke-dasharray:640;stroke-dashoffset:640;transition:stroke-dashoffset 1.2s cubic-bezier(.22,1,.36,1)}
#app .sx-svg .sx-l2{stroke:rgba(255,255,255,.22);transition-delay:calc(.5s + var(--d) * .05s)}
#app .sx-cap.in .sx-svg path{stroke-dashoffset:0}
#app .sx-n1{fill:#fd4533}#app .sx-n2{fill:#181818;stroke:#fd4533;stroke-width:2}#app .sx-n3{fill:rgba(255,255,255,.85);opacity:0;transition:opacity .5s ease calc(1s + var(--d) * .06s)}
#app .sx-cap.in .sx-n3{opacity:1}
#app .sx-svg text{font:600 15px var(--kr);fill:rgba(255,255,255,.75)}
#app .sx-svg .sx-t1{fill:#fff;font-weight:700}
#app .sx-svg .sx-t3{font-size:13px;fill:rgba(255,255,255,.55)}
#app .sx-ob{padding:18px 20px;border-radius:12px;background:#181818;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .sx-ob small{display:block;margin-bottom:8px;font:700 11.5px/1 var(--en);letter-spacing:.12em;color:#fd4533}
#app .sx-ob p{margin:0;font:600 15.5px/1.5 var(--kr);color:#fff;text-wrap:pretty}
#app .sx-track{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-radius:999px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .sx-track li{position:relative;padding:14px 0;text-align:center;font:700 12.5px/1 var(--en);letter-spacing:.16em;color:rgba(255,255,255,.7)}
#app .sx-track li+li::before{content:"❯";position:absolute;left:-6px;top:50%;transform:translateY(-50%);color:#fd4533;font-size:12px}
#app .sx-track li:last-child{background:rgba(253,69,51,.12);color:#fff}
@media (prefers-reduced-motion:reduce){#app .sx-svg path{stroke-dashoffset:0;transition:none}#app .sx-n3{opacity:1;transition:none}#app .sx-b{transform:none;opacity:1}}
/* 08 CTA: 풀블리드 다크 배너 */
#app .p-studio .sx-cta{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);border-radius:0;box-shadow:none;padding:clamp(72px,8vw,120px) 24px;background:radial-gradient(60% 120% at 50% 100%,rgba(253,69,51,.14),rgba(253,69,51,0) 70%),#0d0d0d}
#app .p-studio .sx-cta p{font-size:clamp(24px,2.6vw,36px);font-weight:700}
@media (max-width:900px){#app .sx-pain{grid-template-columns:minmax(0,1fr)}#app .sx-wire{position:relative;top:auto}#app .sx-ch,#app .sx-outs{grid-template-columns:minmax(0,1fr)}#app .sx-ch>div{justify-items:start;text-align:left}#app .sx-svg{margin:12px 0}}
#app .sx-out .sx-ok{display:block;margin:0 0 10px;font:700 11px/1 var(--en) !important;letter-spacing:.14em;color:#fd4533 !important}
#app .sx-out .sx-tree{display:grid;gap:8px;padding-left:12px;border-left:1px solid rgba(253,69,51,.5)}
#app .sx-out .sx-tree p{position:relative;margin:0;font:600 13.5px/1.3 var(--kr) !important;color:#fff !important}
#app .sx-out .sx-tree p::before{content:"";position:absolute;left:-12px;top:50%;width:8px;height:1px;background:rgba(253,69,51,.5)}
@media (max-width:900px){#app .sx-svg text{display:none}#app .sx-track li{font-size:10.5px;letter-spacing:.08em}#app .sx-track li+li::before{left:-3px}}
/* 예시 화면(화이트) 속 채팅 말풍선: 고객 말은 진한 말풍선, AI 답은 연회색 말풍선으로 구분 */
#app .rfx-shot .chat .bub{padding:13px 16px !important;border-radius:16px !important;font:600 15px/1.55 var(--kr) !important;max-width:82% !important}
#app .rfx-shot .chat .bub.u{align-self:flex-end;background:#111 !important;color:#fff !important;box-shadow:none !important;border-bottom-right-radius:5px !important}
#app .rfx-shot .chat .bub.a{align-self:flex-start;background:#f1f1f4 !important;color:#111 !important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06) !important;border-bottom-left-radius:5px !important}
#app .rfx-shot .chat .bub.a small{display:block;margin-bottom:6px;font:600 12px/1.3 var(--kr) !important;color:#6b6e75 !important}
#app .rfx-shot .chat .bub *{color:inherit}
#app .rfx-shot .chat .bub.a small{color:#6b6e75 !important}
#app .rfx-shot .chat .rfm-card b{color:#e0301f !important}
#app .rfx-shot .chat .rfm-card div .is-ok{color:#fff !important}
/* 서비스 탭 줄: 히어로와 같은 왼쪽 라인(화면 여백 --pad 기준)에서 시작 — 큰 화면에서 1296px 가운데 칸에 갇혀 오른쪽으로 밀리던 것 수정 */
#app .pv-tabbar > .wrap{width:calc(100% - 2 * var(--pad,72px)) !important;max-width:none !important;margin-left:auto !important;margin-right:auto !important}
/* AX ONE 시나리오 탭: 진행 바를 글자 시작점에 맞춤 + 호버(차분하게) — 제목 밝아짐 · 라벨 키컬러 · 시작점부터 옅은 선이 그어짐 */
#app .oa-tab .oa-bar{left:0 !important;right:0 !important;width:auto !important;bottom:8px}
#app .oa-tab::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:1px;background:rgba(255,255,255,.3);transform:scaleX(0);transform-origin:left;transition:transform .8s cubic-bezier(.22,1,.36,1);pointer-events:none}
#app .oa-tab:not(.on):hover::after,#app .oa-tab:not(.on):focus-visible::after{transform:scaleX(1)}
#app .oa-tab em,#app .oa-tab b{transition:color .5s ease}
#app .oa-tab:not(.on):hover,#app .oa-tab:not(.on):focus-visible{color:#fff}
#app .oa-tab:not(.on):hover em,#app .oa-tab:not(.on):focus-visible em{color:rgba(253,69,51,.85)}
#app .oa-tab:focus-visible{outline:none}
@media (prefers-reduced-motion:reduce){#app .oa-tab::after{transition:none}}
/* 숫자 블록 호버 빛: 칸 왼쪽 고정 위치 → 숫자 자체의 가운데에 맞춤(가운데 정렬 · 크기 변화에도 따라감) */
#app .nx>div::before,#app .story-nx .nx>div::before{display:none !important}
#app .nx>div>b{position:relative}
#app .nx>div>b::before{content:"";position:absolute;left:50%;top:50%;width:clamp(260px,22vw,320px);aspect-ratio:1;border-radius:50%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(253,69,51,.3),rgba(253,69,51,.1) 50%,rgba(253,69,51,0) 100%);opacity:0;transform:translate(-50%,-50%) scale(.7);transition:opacity .7s ease,transform 1s cubic-bezier(.22,1,.36,1)}
#app .nx>div:hover>b::before{opacity:1;transform:translate(-50%,-50%)}
/* 서비스 히어로 정리: 라벨 줄(SERVICE · 국문 · 영문) / 서비스명 + 우측 아이콘 · CTA / 메인 타이틀 / 서브 타이틀 */
#app .pv3-crumb .pv3-ck{font:700 14px/1 var(--kr) !important;letter-spacing:-.01em !important;text-transform:none !important;color:#fff}
#app .pv3-crumb .pv3-ce{font:600 11.5px/1 var(--en) !important;letter-spacing:.16em !important;text-transform:uppercase !important;color:rgba(255,255,255,.45)}
#app .pv3-side{display:flex;flex-direction:column;align-items:flex-end;gap:18px;flex:none}
#app .pv3-side .btn{white-space:nowrap}
#app .pv3-intro2{display:block !important;margin-top:clamp(40px,4.4vw,72px)}
#app .pv3-intro2 h2{margin:0;max-width:none}
#app .pv3-sub{margin:20px 0 0;max-width:760px;font:400 clamp(17px,1.3vw,20px)/1.7 var(--kr);letter-spacing:-.025em;color:rgba(255,255,255,.66);word-break:keep-all;text-wrap:pretty}
@media (max-width:900px){#app .pv3-id{flex-direction:column !important;align-items:flex-start !important}#app .pv3-side{flex-direction:row;align-items:center;gap:14px}#app .pv3-crumb{flex-wrap:wrap;row-gap:8px}}
#app .pv3-crumb .pv3-ck{color:#fff !important;opacity:1 !important}
#app .pv3-sub{max-width:900px}
/* 서비스 히어로: 서비스명 · 아이콘 · CTA를 한 줄에(아이콘과 CTA 가로로 나란히), 탭 줄 아래로 바짝 붙임 */
#app .pv-tabbar + .pv3-hero{padding-top:clamp(28px,2.6vw,44px) !important}
#app .pv3-id{align-items:center !important}
#app .pv3-side{flex-direction:row !important;align-items:center !important;gap:clamp(16px,1.6vw,28px) !important}
#app .pv3-side .pv3-icon{width:clamp(96px,8vw,132px) !important;height:clamp(96px,8vw,132px) !important}
/* 서비스 헤드 아이콘: 보이는 아이콘이 서비스명 대문자 높이만큼(캔버스는 그림 둘레 여백 포함이라 상자를 더 크게), 줄 높이는 그대로 */
@media (min-width:901px){
 #app .pv3-side .pv3-icon{width:min(14vw,234px) !important;height:min(14vw,234px) !important;margin-block:calc((min(9.36vw,154.8px) - min(14vw,234px)) / 2) !important}
}
@media (min-width:901px){
 /* 캔버스 좌우 빈 여백만큼 가로 폭을 상쇄 — 긴 서비스명(GROWTH)에서도 CTA가 오른쪽 라인 안에 */
 #app .pv3-side .pv3-icon{margin-inline:calc(min(14vw,234px) * -.18) !important}
 #app .pv3-side{gap:clamp(12px,1.2vw,20px) !important}
 /* DESK 아이콘은 그림이 작게 그려져 상자를 더 키워 같은 높이로 보이게 */
 #app .p-desk .pv3-side .pv3-icon{width:min(19vw,318px) !important;height:min(19vw,318px) !important;margin-block:calc((min(9.36vw,154.8px) - min(19vw,318px)) / 2) !important;margin-inline:calc(min(19vw,318px) * -.22) !important}
}
@media (min-width:901px){#app .pv3-id{flex-wrap:wrap;row-gap:18px}#app .pv3-side{margin-left:auto}}
/* 서비스 헤드 라벨: SERVICE 번호 삭제, 국문 서비스 태그를 키워 왼쪽 라인에서 시작 */
#app .pv3-crumb{gap:14px !important;align-items:baseline !important}
#app .pv3-crumb .pv3-ck{font:700 clamp(18px,1.5vw,22px)/1.2 var(--kr) !important;letter-spacing:-.03em !important;color:#fff !important}
#app .pv3-crumb .pv3-ce{font-size:12px !important}
/* ===== What We Do: 표 형태 → 아이콘 카드 4열 ===== */
#app .pv2 .pv4-wd{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.2vw,18px);border-top:0 !important}
#app .pv2 .pv4-wd article{display:flex !important;flex-direction:column;gap:0;padding:clamp(26px,2.4vw,34px) !important;border-radius:16px;border:0 !important;background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.015)) !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12) !important;transition:box-shadow .5s ease,transform .6s cubic-bezier(.22,1,.36,1) !important}
#app .pv2 .pv4-wd article::before{display:none !important}
#app .pv2 .pv4-wd article:hover{padding-left:clamp(26px,2.4vw,34px) !important;transform:translateY(-4px);box-shadow:inset 0 0 0 1px rgba(253,69,51,.55) !important}
#app .pv2 .pv4-wd .wd-ico{display:block;width:52px;height:52px;margin-bottom:clamp(36px,3.6vw,56px);color:#fff}
#app .pv2 .pv4-wd .wd-ico svg{width:100%;height:100%;overflow:visible}
#app .pv2 .pv4-wd .wd-ico svg>*{stroke:#fd4533}
#app .pv2 .pv4-wd .wd-ico svg .f{stroke:rgba(255,255,255,.55)}
#app .pv2 .pv4-wd article:hover .wd-ico svg>*{animation:wdDraw 1.1s cubic-bezier(.22,1,.36,1)}
@keyframes wdDraw{from{stroke-dasharray:120;stroke-dashoffset:120}to{stroke-dasharray:120;stroke-dashoffset:0}}
#app .pv2 .pv4-wd .h{margin:0 0 10px !important}
#app .pv2 .pv4-wd h4{margin:0 !important;font:800 clamp(19px,1.5vw,22px)/1.35 var(--kr) !important;letter-spacing:-.035em}
#app .pv2 .pv4-wd article>p:not(.h){margin:12px 0 0 !important;font:400 15px/1.65 var(--kr) !important;color:rgba(255,255,255,.66) !important;grid-column:auto !important}
#app .pv2 .pv4-wd .pv4-ar{display:none !important}
@media (max-width:1100px){#app .pv2 .pv4-wd{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){#app .pv2 .pv4-wd{grid-template-columns:minmax(0,1fr)}#app .pv2 .pv4-wd .wd-ico{margin-bottom:24px}}
@media (prefers-reduced-motion:reduce){#app .pv2 .pv4-wd article:hover .wd-ico svg>*{animation:none}}
/* ===== DESK 페인: 흩어진 업무 → AX DESK로 연결 ===== */
#app .dk-wf svg,#app .gr-wf svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#app .dk-l{stroke:#fd4533;stroke-width:1.5;stroke-dasharray:4 6;opacity:calc(var(--p) * .9)}
#app .dk-n{transform:translate(calc(var(--x) * (1 - var(--p)) * 1px),calc(var(--y) * (1 - var(--p)) * 1px));transform-box:view-box}
#app .dk-n rect{fill:#222226;stroke:rgba(255,255,255,.28);stroke-width:1}
#app .dk-n text{font:700 13px var(--kr);fill:#fff}
#app .dk-hub{fill:#fd4533;opacity:calc(.35 + var(--p) * .65)}
#app .dk-ht{font:800 13px var(--en);fill:#fff;letter-spacing:.02em}
/* ===== GROWTH 페인: 광고 지표 ↑ · 매출 → ===== */
#app .gr-ax{fill:none;stroke:rgba(255,255,255,.18);stroke-width:1}
#app .gr-m{font:500 11px var(--kr);fill:rgba(255,255,255,.45)}
#app .gr-a,#app .gr-b{fill:none;stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--p))}
#app .gr-a{stroke:#fd4533}#app .gr-b{stroke:rgba(255,255,255,.75)}
#app .gr-da{fill:#fd4533;opacity:var(--p)}#app .gr-db{fill:#fff;opacity:var(--p)}
#app .gr-gap{fill:none;stroke:rgba(255,255,255,.4);stroke-width:1;stroke-dasharray:3 4;opacity:var(--p)}
#app .gr-gt{font:800 18px var(--en);fill:#fff;opacity:var(--p)}
#app .gr-la{font:700 13px var(--kr);fill:#fd4533;opacity:var(--p)}#app .gr-lb{font:700 13px var(--kr);fill:#fff;opacity:var(--p)}
@media (prefers-reduced-motion:reduce){#app .dk-n{transform:none}}
/* ===== STUDIO 이런 과제라면: 상황 → 해결 카드 ===== */
#app #cases .cs-list{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;list-style:none;margin-top:clamp(28px,3vw,44px) !important;padding:0;border:0 !important}
#app #cases .cs-list li{display:flex !important;flex-direction:column;justify-content:space-between;gap:22px;min-height:180px;padding:22px !important;border-radius:14px;border:0 !important;background:#17171a !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app #cases .cs-q{display:block !important;font:600 16px/1.5 var(--kr) !important;color:#fff !important}
#app #cases .cs-q em{display:block;margin-bottom:12px;font:700 12px/1 var(--en);font-style:normal;color:#fd4533}
#app #cases .cs-a{display:flex !important;align-items:center;gap:8px;font:700 14.5px/1.4 var(--kr) !important;color:#fd4533 !important;padding-top:14px;border-top:1px dashed rgba(255,255,255,.18)}
#app #cases .cs-a::before{content:"→";font-family:var(--en)}
@media (max-width:1100px){#app #cases .cs-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* ===== GROWTH 증상으로 찾기: 증상 → 해결 카드 ===== */
#app .gy-l{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
#app .gy-l li{display:flex !important;flex-direction:column;justify-content:space-between;gap:22px;padding:24px !important;border:0 !important;border-radius:14px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .gy-l span{font:600 16px/1.5 var(--kr) !important;color:#fff !important}
#app .gy-l b{display:flex;align-items:center;gap:8px;padding-top:14px;border-top:1px dashed rgba(255,255,255,.18);color:#fd4533 !important}
#app .gy-l b::before{content:"→" !important;color:#fd4533}
@media (max-width:900px){#app .gy-l{grid-template-columns:minmax(0,1fr)}}
/* 페인 항목별 도트 그림 패널 — 어두운 화면(서비스 아이콘과 같은 결), 반전 섹션 안에서도 원래 색 */
#app .pv-viz{position:sticky;top:120px}
#app .pv-viz canvas{display:block;width:100%;aspect-ratio:4/3;border-radius:16px;background:#121214;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1),0 30px 60px -36px rgba(0,0,0,.6)}
#app .pv-viz-cap{display:flex;align-items:baseline;gap:10px;margin:14px 2px 0;font:700 15px/1.3 var(--kr);color:#fff}
#app .pv-viz-cap em{font:700 12px/1 var(--en);font-style:normal;color:#fd4533}
#app .sx-pl li{cursor:pointer;outline:none;opacity:.42;transition:opacity .5s ease}
#app .sx-pl li.on,#app .sx-pl li:hover,#app .sx-pl li:focus-visible{opacity:1}
#app .sx-pl li.on .n{color:#fd4533}
@media (max-width:900px){#app .pv-viz{position:relative;top:auto}#app .sx-pl li{opacity:1}}
/* What We Do: 인덱스와 같은 3가지 역량 → 3열 */
#app .pv2 .pv4-wd{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1100px){#app .pv2 .pv4-wd{grid-template-columns:minmax(0,1fr)}}
/* 서비스 헤드 아이콘: CTA 옆 → 서비스명 바로 옆(서비스명 높이만큼), CTA는 오른쪽에 단독 */
#app .pv3-nmrow{display:flex;align-items:center;gap:clamp(4px,.8vw,14px)}
#app .pv3-nmrow .pv3-name{flex:none}
#app .pv3-nmrow .pv3-icon{flex:none;width:min(14vw,234px) !important;height:min(14vw,234px) !important;margin-block:calc((min(9.36vw,154.8px) - min(14vw,234px)) / 2) !important;margin-inline:calc(min(14vw,234px) * -.16) !important}
#app .p-desk .pv3-nmrow .pv3-icon{width:min(19vw,318px) !important;height:min(19vw,318px) !important;margin-block:calc((min(9.36vw,154.8px) - min(19vw,318px)) / 2) !important;margin-inline:calc(min(19vw,318px) * -.2) !important}
#app .pv3-side{margin-left:auto}
@media (max-width:900px){#app .pv3-nmrow .pv3-icon,#app .p-desk .pv3-nmrow .pv3-icon{width:84px !important;height:84px !important;margin:-12px -10px !important}}
@media (min-width:901px){#app .p-desk .pv3-nmrow .pv3-icon{margin-inline:calc(min(19vw,318px) * -.12) calc(min(19vw,318px) * -.2) !important}}
@media (max-width:900px){#app .pv3-nmrow{flex-wrap:wrap;row-gap:4px}#app .pv3-side{margin-left:0}}
@media (max-width:900px){#app .pv3-side{align-self:flex-start !important;margin:6px 0 0 !important}}
/* Plan First 핵심 문구: Our Evolution(We Went Wider.)과 같은 결 — 라벨 / 큰 영문 타이틀(마지막 단어 키컬러) / 가운데 국문 문장 */
#app .pf-tag{display:block;text-align:center;margin:0 auto !important}
#app .pf-big{display:block;text-align:center;width:100%;margin:clamp(28px,3.4vw,48px) auto 0 !important;font:800 clamp(56px,8.6vw,132px)/1.02 var(--en) !important;letter-spacing:-.055em !important;color:#f3f3f3;white-space:nowrap;padding:0 .06em .08em}
#app .pf-big em{font-style:normal;color:#fd4533}
#app .pf-sub{margin:clamp(36px,4vw,64px) auto 0;text-align:center}
#app .pf-sub .fill{max-width:1100px;margin:0 auto !important;text-align:center !important;font-size:clamp(18px,1.6vw,24px) !important;line-height:1.7 !important}
@media (max-width:820px){#app .pf-big{font-size:clamp(44px,13vw,72px) !important;white-space:normal;line-height:1.05 !important}}
#app .pv2 section .pf-sub .fill,#app section:has(.pv4-doc) .pf-sub .fill{font-size:clamp(18px,1.6vw,24px) !important;line-height:1.7 !important}
/* Plan First 접지(인덱스 무료 진단 리플릿과 같은 결) */
#app .pf-fold{margin-top:clamp(48px,5.4vw,88px)}
#app .pf-fold .dg-offer{flex:1.1 1 0}
#app .pf-fold .dg-list{flex:4 1 0}
#app .pf-fold .pf-doc{margin:22px 0 0 !important;font:800 clamp(26px,2.3vw,34px)/1.3 var(--kr) !important;letter-spacing:-.045em !important;word-break:keep-all}
#app .pf-fold .pf-steps{flex-wrap:wrap;row-gap:8px}
#app .pf-fold .pf-steps li{font-size:11.5px !important;letter-spacing:.04em}
#app .pf-fold .dg-item h4{font-size:clamp(17px,1.35vw,20px) !important;letter-spacing:.02em !important}
#app .pf-fold .dg-item h4 small{font:700 15px/1.45 var(--kr) !important;letter-spacing:-.02em !important;color:#fff !important;margin-top:4px}
#app .pf-fold .dgx-def{font-size:14.5px !important;line-height:1.6 !important;color:rgba(255,255,255,.66) !important;font-weight:400 !important}
#app .pf-fold .dgx-get{margin-top:auto !important}
/* ===== 서비스 페이지 챕터 타이틀 = 어바웃 챕터 타이틀(ABH) 규격 =====
   가운데 정렬: 영문 라벨(17px 굵게) → 큰 영문 타이틀(한 줄, 마지막 강조어 키컬러) → 국문 리드(23px) */
#app .pv2 .section-index{display:block;text-align:center;margin:0 auto clamp(26px,3vw,40px) !important;font:700 clamp(15px,1.2vw,17px)/1.5 var(--en) !important;letter-spacing:.02em !important;text-transform:uppercase;color:#fff !important}
#app .pv2 .section-index::before,#app .pv2 .section-index::after{display:none !important;content:none !important}
#app .pv2 .hl{display:block !important;text-align:center !important;margin-bottom:clamp(48px,5.6vw,100px) !important}
#app .pv2 .hl h2{display:block !important;margin:0 auto !important;text-align:center !important;font:800 clamp(52px,8.6vw,124px)/1.02 var(--en) !important;letter-spacing:-.055em !important;color:#f3f3f3 !important;white-space:normal !important;text-wrap:balance}
#app .pv2 .hl h2 .mask{display:inline-block !important;padding:0 .08em .12em !important;margin:0 -.08em -.12em !important;vertical-align:top}
#app .pv2 .hl h2 .mask + .mask{margin-left:.18em !important}
#app .pv2 .hl h2 .mask.g span{color:#f3f3f3 !important}
#app .pv2 .hl .kc{display:block !important;margin:clamp(40px,5vw,72px) auto 0 !important;max-width:1100px;text-align:center !important;padding:0 !important;border:0 !important}
#app .pv2 .hl .kc b{display:block;font:600 clamp(19px,1.6vw,23px)/1.6 var(--kr) !important;letter-spacing:-.057em !important;color:#f3f3f3 !important}
#app .pv2 .hl .kc p{margin:10px auto 0 !important;max-width:820px;font:400 clamp(16px,1.2vw,18px)/1.7 var(--kr) !important;color:rgba(255,255,255,.62) !important;text-align:center !important}
@media (max-width:820px){#app .pv2 .hl h2{font-size:clamp(40px,12vw,64px) !important;line-height:1.05 !important}}
#app .pv2 .hl h2 .section-keyword,#app .pv2 .hl h2 .mask.g .section-keyword{color:#fd4533 !important;-webkit-text-fill-color:#fd4533 !important}
/* STUDIO Chapter 1: 근거 4개가 같은 무게로 겹치는 4원 벤다이어그램(가운데 = 콘셉트) */
#app .ch1v .cv-wrap{width:min(100%,480px) !important;height:auto !important;padding-bottom:0 !important;aspect-ratio:1/1 !important}
#app .cv4{position:absolute;width:56%;aspect-ratio:1/1;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22);background:radial-gradient(closest-side,rgba(255,255,255,.035),rgba(255,255,255,0));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;transition:box-shadow .5s ease,background .5s ease}
#app .cv4:hover{box-shadow:inset 0 0 0 1px rgba(253,69,51,.6);background:radial-gradient(closest-side,rgba(253,69,51,.08),rgba(253,69,51,0))}
#app .cv4-1{left:0;top:0;padding:0 22% 22% 0}
#app .cv4-2{right:0;top:0;padding:0 0 22% 22%}
#app .cv4-3{left:0;bottom:0;padding:22% 22% 0 0}
#app .cv4-4{right:0;bottom:0;padding:22% 0 0 22%}
#app .cv4 .cv-ico{width:64px !important;height:52px !important;margin-bottom:4px}
#app .cv4 small{font:700 10.5px/1 var(--en);letter-spacing:.12em;color:#fd4533}
#app .cv4 b{font:700 clamp(14px,1.15vw,16px)/1.3 var(--kr);letter-spacing:-.03em;color:#fff;text-align:center;word-break:keep-all;max-width:9em}
#app .cv4-core{position:absolute;left:35%;top:35%;width:30%;aspect-ratio:1/1;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:2;background:radial-gradient(closest-side,rgba(253,69,51,.45),rgba(253,69,51,.12) 70%,rgba(253,69,51,.04));box-shadow:inset 0 0 0 1.5px #fd4533,0 0 40px -6px rgba(253,69,51,.55)}
#app .cv4-core small{font:800 clamp(13px,1.2vw,16px)/1 var(--kr);letter-spacing:-.02em;color:#fff}
/* 5단계: 단계명 + 한 줄 설명 */
#app .ch1-rail li{display:grid !important;grid-template-columns:28px minmax(0,1fr);column-gap:10px;row-gap:5px;align-items:baseline;padding:14px 18px !important}
#app .ch1-rail li b{font:700 15.5px/1.35 var(--kr);color:#fff}
#app .ch1-rail li span{grid-column:2;font:400 13.5px/1.55 var(--kr);color:rgba(255,255,255,.62)}
/* 서비스 히어로: 서브 슬로건을 메인 타이틀 아래로 바짝 */
#app .pv3-intro2 .pv3-sub{margin-top:6px !important}
/* 서비스 프로세스: 메인처럼 길게 엇갈리지 않고 4장을 한 줄에 — 바위 배경은 카드 줄 뒤에 꽉 차게(위아래 끝은 부드럽게 사라짐) */
#app .pv2 #pv-how .ps-field{padding:clamp(48px,5vw,80px) 0 clamp(56px,6vw,96px) !important;min-height:0 !important;overflow:visible !important}
#app .pv2 #pv-how .ps-list{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:clamp(12px,1.4vw,20px) !important;max-width:none !important;margin:0 !important;position:relative;z-index:1}
#app .pv2 #pv-how .ps-card,#app .pv2 #pv-how .ps-card:nth-child(n){grid-column:auto !important;grid-row:auto !important;margin:0 !important;translate:none !important;rotate:none !important;width:auto !important;max-width:none !important;aspect-ratio:auto !important;min-height:clamp(280px,22vw,340px) !important;padding:clamp(26px,2.2vw,34px) !important;display:flex !important;flex-direction:column}
#app .pv2 #pv-how .ps-card h3{font-size:clamp(24px,2vw,32px) !important}
#app .pv2 #pv-how .ps-card .ps-desc{margin-top:auto !important;padding-top:16px}
#app .pv2 #pv-how .ps-rocks{position:absolute;inset:0;z-index:0;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 18%,#000 82%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 18%,#000 82%,transparent 100%)}
#app .pv2 #pv-how .ps-rk.rk-a{position:absolute !important;inset:0 !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;transform:none !important;opacity:1 !important;-webkit-mask-image:none !important;mask-image:none !important}
#app .pv2 #pv-how .ps-rk.rk-a img{position:absolute !important;inset:0 !important;left:0 !important;top:0 !important;width:100% !important;height:100% !important;object-fit:cover !important;object-position:50% 45% !important;filter:grayscale(1) brightness(.9) contrast(1.15) !important;transform:none !important}
#app .pv2 #pv-how .ps-rk.rk-b{display:none !important}
@media (max-width:1100px){#app .pv2 #pv-how .ps-list{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media (max-width:600px){#app .pv2 #pv-how .ps-list{grid-template-columns:minmax(0,1fr) !important}#app .pv2 #pv-how .ps-card,#app .pv2 #pv-how .ps-card:nth-child(n){min-height:0 !important}}
#app .pv2 #pv-how .ps-list{padding-inline:clamp(20px,5vw,72px) !important}
#app .pv2 #pv-how .ps-card .ps-desc{margin-top:0 !important;padding-top:0}
#app .pv2 #pv-how .ps-card .ps-lead{margin-bottom:auto !important;padding-bottom:20px}
#app .pv2 #pv-how .ps-card:has(.ps-shot) .ps-lead{margin-bottom:0 !important}
#app .pv2 #pv-how .ps-card:has(.ps-shot) .ps-desc{margin-top:auto !important;padding-top:20px}
#app .pv2 #pv-how .ps-card .ps-shot{margin-top:18px !important}
/* STUDIO Sound familiar?: 병목마다 증상 → 해결 이름(하단 If this sounds familiar 통합) */
#app .sx-pl .sx-cs{grid-column:2;list-style:none;margin:6px 0 0;padding:0;display:grid;gap:0;border-top:1px solid rgba(255,255,255,.1)}
#app .sx-pl .sx-cs li{display:grid !important;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1);opacity:1 !important;cursor:inherit}
#app .sx-pl .sx-cs-q{font:500 clamp(14px,1vw,15.5px)/1.5 var(--kr);color:rgba(255,255,255,.62)}
#app .sx-pl .sx-cs-a{display:inline-flex;align-items:center;gap:8px;font:700 clamp(14px,1vw,15.5px)/1.4 var(--kr);color:#fff;white-space:nowrap;text-align:right}
#app .sx-pl .sx-cs-a::before{content:"→";font-family:var(--en);color:#fd4533}
#app .sx-pl li.on .sx-cs-a,#app .sx-pl li:hover .sx-cs-a{color:#fd4533}
#app .sx-pl li.on .sx-cs-a::before{color:#fd4533}
#app .sx-cs-note{margin:clamp(28px,3vw,44px) 0 0;font:400 14px/1.6 var(--kr);color:rgba(255,255,255,.5)}
@media (max-width:600px){#app .sx-pl .sx-cs li{grid-template-columns:1fr;gap:4px}#app .sx-pl .sx-cs-a{white-space:normal;text-align:left}}
/* Q&A: 닫힌 상태는 외곽 박스 없이, 열면 유리 박스 */
#app .faq details.glass:not([open]),#app .faq details.glass:not([open]):hover{background:transparent !important;background-image:none !important;box-shadow:none !important;border-color:transparent !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important}
#app .faq details.glass:not([open])::before,#app .faq details.glass:not([open])::after{opacity:0 !important}
/* ===== GROWTH 가격표 v2 — 흰 패널 · 한 장의 비교표(세로 헤어라인) · 대행 여부 세그먼트 · 제공 사다리 ===== */
#app .gp{position:relative;margin-top:clamp(28px,3vw,44px);border-radius:24px;background:#fff;color:#111;overflow:hidden;box-shadow:0 40px 80px -48px rgba(0,0,0,.6)}
#app .gp *{color:inherit}
#app .gp-in{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
#app .gp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:clamp(28px,3vw,44px) clamp(24px,3vw,44px) 0}
#app .gp-kick{margin:0 0 12px;font:700 12px/1 var(--en);letter-spacing:.14em;text-transform:uppercase;color:#8a8d94 !important}
#app .gp-msg{margin:0;font:800 clamp(22px,2.1vw,30px)/1.3 var(--kr);letter-spacing:-.035em;color:#111 !important}
#app .gp-msg em{font-style:normal;color:#fd4533 !important}
#app .gp-msg1,#app .gp-in1:checked ~ .gp-head .gp-msg0{display:none}
#app .gp-in1:checked ~ .gp-head .gp-msg1{display:inline}
#app .gp-seg{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:5px;border-radius:999px;background:#f1f2f4;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
#app .gp-seg label{position:relative;z-index:1;padding:13px 22px;text-align:center;font:700 14.5px/1 var(--kr);color:#8a8d94 !important;cursor:pointer;white-space:nowrap;transition:color .35s ease}
#app .gp-pill{position:absolute;z-index:0;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:999px;background:#111;transition:transform .5s cubic-bezier(.22,1,.36,1),background-color .4s ease}
#app .gp-in0:checked ~ .gp-head .gp-seg label[for=gp-m0],#app .gp-in1:checked ~ .gp-head .gp-seg label[for=gp-m1]{color:#fff !important}
#app .gp-in1:checked ~ .gp-head .gp-pill{transform:translateX(100%);background:#fd4533}
#app .gp-in0:focus-visible ~ .gp-head .gp-seg label[for=gp-m0],#app .gp-in1:focus-visible ~ .gp-head .gp-seg label[for=gp-m1]{outline:2px solid #fd4533;outline-offset:2px;border-radius:999px}
/* 제공 사다리: 미대행이면 Core만 FREE, 대행이면 금액이 커질수록 Matrix · Quantum까지 FREE */
#app .gp-ladder{position:relative;margin:clamp(22px,2.4vw,32px) clamp(24px,3vw,44px) 0;padding:16px 18px;border-radius:14px;background:#f6f6f7}
#app .gp-lad0,#app .gp-lad1{display:flex;align-items:center;gap:18px}
#app .gp-lad1,#app .gp-in1:checked ~ .gp-ladder .gp-lad0{display:none}
#app .gp-in1:checked ~ .gp-ladder .gp-lad1{display:flex;position:relative}
#app .gp-lk{flex:0 0 auto;min-width:96px;font:700 12.5px/1.3 var(--kr);color:#55585f !important}
#app .gp-ladder ol{flex:1;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
#app .gp-ladder li{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:10px 14px;border-radius:10px;background:#fff;box-shadow:inset 0 0 0 1px rgba(0,0,0,.07)}
#app .gp-ladder li b{font:700 14px/1 var(--en);color:#111 !important}
#app .gp-ladder li small{font:700 11.5px/1 var(--en);color:#8a8d94 !important;letter-spacing:.04em}
#app .gp-ladder li.is-free{background:#fff1ee;box-shadow:inset 0 0 0 1px rgba(253,69,51,.35)}
#app .gp-ladder li.is-free small{color:#fd4533 !important}
#app .gp-lad1 li:nth-child(1){opacity:.72}#app .gp-lad1 li:nth-child(2){opacity:.86}
#app .gp-lad1 ol{position:relative}
#app .gp-arrow{position:absolute;left:132px;right:18px;bottom:6px;height:2px;background:linear-gradient(90deg,rgba(253,69,51,.15),#fd4533);border-radius:2px}
#app .gp-arrow::after{content:"";position:absolute;right:-1px;top:-4px;border:5px solid transparent;border-left:7px solid #fd4533;border-right:0}
#app .gp-in1:checked ~ .gp-ladder .gp-lad1 li{animation:gpUp .6s cubic-bezier(.22,1,.36,1) both}
#app .gp-in1:checked ~ .gp-ladder .gp-lad1 li:nth-child(2){animation-delay:.08s}#app .gp-in1:checked ~ .gp-ladder .gp-lad1 li:nth-child(3){animation-delay:.16s}
@keyframes gpUp{from{transform:translateY(6px);opacity:0}}
/* 비교표: 카드 대신 한 장 안에서 세로 헤어라인으로 나눔 */
#app .gp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:clamp(22px,2.4vw,32px);border-top:1px solid rgba(0,0,0,.08)}
#app .gp-card{position:relative;display:flex;flex-direction:column;padding:clamp(26px,2.6vw,38px) clamp(22px,2.6vw,40px) clamp(30px,3vw,44px)}
#app .gp-card+.gp-card{border-left:1px solid rgba(0,0,0,.08)}
#app .gp-card.is-key{background:linear-gradient(180deg,#fff6f4,#fff 70%)}
#app .gp-card.is-key::before{content:"";position:absolute;left:0;right:0;top:-1px;height:3px;background:#fd4533}
#app .gp-top{display:flex;align-items:center;gap:10px;min-height:30px}
#app .gp-top h3{margin:0;font:800 clamp(24px,2vw,30px)/1 var(--en);letter-spacing:-.02em;color:#111 !important}
#app .gp-badge{padding:6px 10px;border-radius:999px;background:#111;color:#fff !important;font:700 11.5px/1 var(--en);letter-spacing:.02em}
#app .gp-card.is-key .gp-badge{background:#fd4533}
#app .gp-lvl{margin-left:auto;display:flex;gap:3px}
#app .gp-lvl i{width:16px;height:4px;border-radius:2px;background:#e3e4e7}
#app .gp-lvl i.f{background:#111}
#app .gp-card.is-key .gp-lvl i.f{background:#fd4533}
#app .gp-tag{margin:12px 0 0;min-height:3em;font:500 14.5px/1.5 var(--kr);color:#55585f !important}
#app .gp-pr{display:flex;flex-direction:column;justify-content:flex-end;gap:8px;min-height:92px;margin-top:18px;padding-bottom:22px;border-bottom:1px solid rgba(0,0,0,.08)}
#app .gp-pr s{display:block;margin-bottom:6px;font:600 15px/1 var(--en);color:#b4b7bd !important}
#app .gp-pr b{font:800 clamp(38px,3.3vw,50px)/1 var(--en);letter-spacing:-.035em;color:#111 !important}
#app .gp-pr small{font:600 13px/1.3 var(--kr);color:#8a8d94 !important}
#app .gp-p0 small{margin-left:8px}
#app .gp-pr .gp-free{color:#fd4533 !important}
#app .gp-p1,#app .gp-in1:checked ~ .gp-grid .gp-p0{display:none}
#app .gp-in1:checked ~ .gp-grid .gp-p1{display:flex;flex-direction:column;gap:8px;animation:gpUp .5s cubic-bezier(.22,1,.36,1) both}
#app .gp-in0:checked ~ .gp-grid .gp-p0{animation:gpUp .5s cubic-bezier(.22,1,.36,1) both}
#app .gp-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:22px;width:100%;padding:16px 18px;border:0;border-radius:999px;background:#fff;color:#111 !important;font:700 15px/1 var(--kr);box-shadow:inset 0 0 0 1px rgba(0,0,0,.16);cursor:pointer;transition:background-color .3s ease,color .3s ease,box-shadow .3s ease}
#app .gp-cta:hover{background:#111;color:#fff !important;box-shadow:none}
#app .gp-card.is-key .gp-cta{background:#fd4533;color:#fff !important;box-shadow:none}
#app .gp-card.is-key .gp-cta:hover{background:#111}
#app .gp-card ul{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:12px}
#app .gp-card li{position:relative;padding-left:20px;font:500 14px/1.6 var(--kr);color:#55585f !important;text-wrap:pretty}
#app .gp-card li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;box-shadow:inset 0 0 0 2px #fd4533}
#app .gp-note{margin:0;padding:18px clamp(24px,3vw,44px);border-top:1px solid rgba(0,0,0,.08);background:#fafafa;font:500 13px/1.5 var(--kr);color:#8a8d94 !important}
#app .gp-n1,#app .gp-in1:checked ~ .gp-note .gp-n0{display:none}
#app .gp-in1:checked ~ .gp-note .gp-n1{display:inline}
@media (max-width:900px){
 #app .gp-grid{grid-template-columns:minmax(0,1fr)}
 #app .gp-card+.gp-card{border-left:0;border-top:1px solid rgba(0,0,0,.08)}
 #app .gp-tag,#app .gp-pr{min-height:0}
 #app .gp-lad0,#app .gp-in1:checked ~ .gp-ladder .gp-lad1{flex-direction:column;align-items:stretch;gap:10px}
 #app .gp-arrow{display:none}
 #app .gp-seg{width:100%}
}
#app .gp .gp-msg,#app .gp .gp-msg span{font-weight:800 !important}
#app .gp .gp-note span{color:#8a8d94 !important}
#app .gp-arrow{display:none !important}
#app .gp-lad1 .gp-lk{color:#fd4533 !important}
@media (max-width:900px){#app .gp-ladder{padding:14px}#app .gp-ladder ol{grid-template-columns:repeat(3,minmax(0,1fr))}#app .gp-ladder li{flex-direction:column;align-items:flex-start;gap:6px;padding:10px 10px;min-width:0}#app .gp-ladder li b{font-size:13px}#app .gp-head{align-items:stretch}}
/* ===== GROWTH Beyond the ad v2 — 흐름도(Sankey): 이탈은 떨어져 나가는 줄기, 데이터는 왼쪽에서 흘러듦, 해설은 박스 없이 헤어라인 ===== */
#app .gfx{margin-top:clamp(36px,4vw,60px)}
#app .gfx-fig{position:relative;aspect-ratio:1160/520}
#app .gfx-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#app .gfx-cut{stroke:rgba(10,10,12,.55);stroke-width:1.5}
#app .gfx-drop{fill:url(#gfxDrop);stroke:rgba(255,255,255,.14);stroke-width:1;cursor:pointer;transition:fill .4s ease,stroke .4s ease}
#app .gfx[data-on="0"] .gfx-drop[data-d="0"],#app .gfx[data-on="1"] .gfx-drop[data-d="1"],#app .gfx[data-on="2"] .gfx-drop[data-d="2"]{fill:url(#gfxDropOn);stroke:rgba(253,69,51,.7)}
#app .gfx-sl{fill:none;stroke:rgba(255,255,255,.18);stroke-width:1;stroke-dasharray:3 4}
#app .gfx-sl.is-on{stroke:rgba(253,69,51,.55);stroke-dasharray:none}
#app .gfx-fl path,#app .gfx-dfl path{fill:none;stroke:#fff;stroke-width:1.2;stroke-linecap:round;stroke-dasharray:2 26;opacity:.32}
#app .gfx-dfl path{opacity:0;stroke-dasharray:2 18}
#app .gfx[data-on="0"] .gfx-dfl path[data-d="0"],#app .gfx[data-on="1"] .gfx-dfl path[data-d="1"],#app .gfx[data-on="2"] .gfx-dfl path[data-d="2"]{opacity:.55}
#app .gfx.in .gfx-fl path{animation:gfxFlow 2.4s linear infinite;animation-delay:calc(var(--k) * -.6s)}
#app .gfx.in .gfx-dfl path{animation:gfxFlow 1.8s linear infinite}
@keyframes gfxFlow{to{stroke-dashoffset:-56}}
#app .gfx-rev{transform:scaleX(0);transform-origin:0 0;transition:transform 1.6s cubic-bezier(.22,1,.36,1) .15s}
#app .gfx.in .gfx-rev{transform:scaleX(1)}
#app .gfx-st{position:absolute;inset:0;list-style:none;margin:0;padding:0;pointer-events:none}
#app .gfx-st li{position:absolute;top:calc(7.69% + 14px);padding:0 14px;display:flex;flex-direction:column;gap:5px}
#app .gfx-st em{font:700 11px/1 var(--en);font-style:normal;letter-spacing:.1em;color:rgba(255,255,255,.6)}
#app .gfx-st b{font:800 clamp(16px,1.5vw,22px)/1.1 var(--kr);letter-spacing:-.03em;color:#fff}
#app .gfx-st small{font:500 clamp(11px,.85vw,12.5px)/1.4 var(--kr);color:rgba(255,255,255,.72)}
#app .gfx-srcl{position:absolute;left:0;top:0;width:18%;height:100%;list-style:none;margin:0;padding:0}
#app .gfx-srcl li{position:absolute;right:0;transform:translateY(-50%);display:flex;align-items:center;gap:8px;font:500 clamp(11px,.9vw,13px)/1 var(--kr);color:rgba(255,255,255,.45);white-space:nowrap}
#app .gfx-srcl li.is-on{color:rgba(255,255,255,.88)}
#app .gfx-srcl i{order:2;width:7px;height:7px;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4)}
#app .gfx-srcl li.is-on i{background:#fd4533;box-shadow:0 0 0 3px rgba(253,69,51,.18)}
#app .gfx-dk{position:absolute;left:0;right:0;top:90.4%}
#app .gfx-db{all:unset;box-sizing:border-box;position:absolute;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 10px;cursor:pointer;text-align:center;white-space:nowrap}
#app .gfx-db span{font:700 10.5px/1 var(--en);letter-spacing:.1em;color:rgba(255,255,255,.45);text-transform:uppercase}
#app .gfx-db b{font:700 13.5px/1.2 var(--kr);color:rgba(255,255,255,.62);transition:color .3s ease}
#app .gfx-db:hover b{color:#fff}
#app .gfx-db.on span{color:#fd4533}#app .gfx-db.on b{color:#fff}
#app .gfx-db:focus-visible{outline:2px solid #fd4533;outline-offset:2px;border-radius:8px}
#app .gfx-cap{margin:clamp(34px,3.4vw,48px) 0 0;font:600 13px/1.5 var(--kr);color:rgba(255,255,255,.7)}
#app .gfx-cap span{display:inline-flex;align-items:center;gap:6px;margin-left:6px}
#app .gfx-cap span::before{content:"";width:7px;height:7px;border-radius:50%;background:#fd4533}
#app .gfx-cap span.is-off::before{background:none;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4)}
#app .gfx-cap small{display:block;margin-top:4px;font:500 12.5px/1.5 var(--kr);color:rgba(255,255,255,.42)}
#app .gfx-note{margin-top:22px;border-top:1px solid rgba(255,255,255,.12)}
#app .gfx-n{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(24px,4vw,64px);padding-top:clamp(22px,2.4vw,32px)}
#app .gfx-n[hidden]{display:none}
#app .gfx-n.on{animation:gpUp .5s cubic-bezier(.22,1,.36,1) both}
#app .gfx-nk{margin:0 0 12px;font:700 12px/1.3 var(--kr);letter-spacing:.02em;color:#fd4533}
#app .gfx-nr .gfx-nk{color:rgba(255,255,255,.5)}
#app .gfx-nh{margin:0;font:800 clamp(20px,1.8vw,26px)/1.4 var(--kr);letter-spacing:-.035em;color:#fff;text-wrap:balance}
#app .gfx-nf{margin:14px 0 0;font:500 15px/1.6 var(--kr);color:rgba(255,255,255,.75)}
#app .gfx-nf span{margin-right:10px;font-weight:700;color:#fd4533}
#app .gfx-nr ul{list-style:none;margin:0;padding:0}
#app .gfx-nr li{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
#app .gfx-nr li:first-child{padding-top:0}
#app .gfx-nr b{font:700 14px/1.5 var(--kr);color:#fff}
#app .gfx-nr li span{font:500 14px/1.6 var(--kr);color:rgba(255,255,255,.66)}
@media (prefers-reduced-motion:reduce){#app .gfx .gfx-fl path,#app .gfx .gfx-dfl path{animation:none}#app .gfx-rev{transition:none;transform:none}}
@media (max-width:900px){
 #app .gfx-fig{aspect-ratio:auto;margin:0 -20px;padding:0 20px;overflow-x:auto;overflow-y:hidden}
 #app .gfx-in{position:relative;width:760px;aspect-ratio:1160/520}
 #app .gfx-n{grid-template-columns:1fr}
 #app .gfx-nr li{grid-template-columns:1fr;gap:4px}
}
#app .gfx-in{position:absolute;inset:0}
@media (max-width:900px){#app .gfx-fig{position:relative}#app .gfx-in{position:relative;inset:auto}}
#app .gfx-fig,#app .gfx-in{aspect-ratio:1160/600}
#app .gfx-node{fill:#fd4533}
#app .gfx-link{transition:opacity .4s ease}
#app .gfx-drop{stroke:rgba(255,255,255,.12)}
#app .gfx-st li{top:3%;width:auto;padding:0;gap:6px}
#app .gfx-st li.is-end{transform:translateX(-100%);text-align:right;align-items:flex-end}
#app .gfx-fl path{stroke-dasharray:2 30;opacity:.38}
@media (max-width:900px){#app .gfx-fig{aspect-ratio:auto}#app .gfx-in{width:760px}}
#app .gfx-st li small{white-space:nowrap}
#app .gfx-cap{margin-top:clamp(8px,1vw,16px)}
/* GROWTH: 꼭 필요한 곳(승인 카드 · 가격표 · 시작 CTA)만 블록, 나머지는 헤어라인 단으로 */
#app .gs-row,#app .gs-row>div{background:none !important;box-shadow:none !important;border-radius:0 !important}
#app .gs-row{border-top:1px solid rgba(255,255,255,.14) !important;border-bottom:1px solid rgba(255,255,255,.08) !important}
#app .gs-row>div+div{border-left:1px solid rgba(255,255,255,.08) !important}
#app .gs-row>div.gs-rx{background:linear-gradient(180deg,rgba(253,69,51,.08),transparent 70%) !important}
#app .gs-tabs .on{box-shadow:none !important;padding:0 !important;border-radius:0 !important;color:#fd4533 !important;font-weight:700}
#app .gm-l{gap:0 !important}
#app .gm-l li{background:none !important;box-shadow:none !important;border-radius:0 !important;padding:6px 0 !important;margin-right:18px}
#app .gm-l li b{color:#fff}
#app .gy-l li,#app .gk-c{background:none !important;box-shadow:none !important;border-radius:0 !important;border-top:1px solid rgba(255,255,255,.14);padding:20px 4px 22px !important}
#app .gy-l li span{font-weight:600}
#app .gy-l li b{border-top:0 !important}
#app .gy-l li>*{border-top:0 !important}
#app .gk-c b{margin:14px 0 12px}
#app .gy-l li,#app .gk-c{border-top:1px solid rgba(255,255,255,.14) !important}
/* ===== 서비스 페이지 제목 위계: 챕터(라벨 있는 공통 섹션 · Our Revolution급 대형 중앙)와 소제목(서비스 고유 블록) 분리.
   소제목 = 영문 → 국문 메인 → 국문 서브 한 단, 왼쪽 정렬, 챕터보다 한 단계 작게 ===== */
#app .pv2 :is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case) .hl{display:block !important;text-align:left !important;margin:0 0 clamp(32px,3.4vw,52px) !important;max-width:820px}
#app .pv2 :is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case) .hl h2{margin:0 !important;text-align:left !important;font:800 clamp(34px,3.7vw,56px)/1.04 var(--en) !important;letter-spacing:-.045em !important;text-wrap:nowrap}
#app .pv2 :is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case) .hl .kc{margin:clamp(16px,1.6vw,22px) 0 0 !important;max-width:none;text-align:left !important}
#app .pv2 :is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case) .hl .kc b{font:700 clamp(21px,1.75vw,27px)/1.4 var(--kr) !important;letter-spacing:-.045em !important}
#app .pv2 :is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case) .hl .kc p{margin:8px 0 0 !important;max-width:640px;text-align:left !important;font:400 clamp(15px,1.1vw,17px)/1.65 var(--kr) !important}
#app .pv2 :is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case) .hl .kc b br{display:none}
/* 소제목 섹션은 챕터보다 위아래 여백도 한 단계 작게 */
#app .pv2 :is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case){padding-top:clamp(72px,7vw,112px) !important;padding-bottom:clamp(72px,7vw,112px) !important}
@media (max-width:820px){#app .pv2 :is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case) .hl h2{font-size:clamp(30px,9vw,40px) !important;text-wrap:balance}}
/* ===== 서비스 페인(Sound Familiar?) v2: 그림을 크게 · 상자 없이 투명 바탕 위에, 목록은 진행선이 흐르는 인덱스 ===== */
#app .sx-pain{display:grid !important;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr) !important;gap:clamp(24px,3vw,56px) !important;align-items:center !important}
#app .pv-viz{position:relative !important;top:auto !important;margin-right:calc(-1 * clamp(0px,2vw,40px))}
#app .pv-viz canvas{background:transparent !important;box-shadow:none !important;border-radius:0 !important;aspect-ratio:4/3;width:100% !important;cursor:crosshair}
#app .pv-viz-cap{justify-content:center;margin-top:4px !important}
#app .sx-pl{gap:0 !important}
#app .sx-pl>li{position:relative;padding:clamp(22px,2.2vw,30px) 0 !important;border-top:1px solid rgba(255,255,255,.1);transition:opacity .5s ease}
#app .sx-pl>li:last-child{border-bottom:1px solid rgba(255,255,255,.1)}
#app .sx-pl>li::after{content:"";position:absolute;left:0;top:-1px;height:1px;width:0;background:#fd4533}
#app .sx-pl>li.on::after{animation:sxProg 4s linear forwards}
#app .sx-pl.is-user>li.on::after{animation:none;width:100%}
@keyframes sxProg{to{width:100%}}
#app .sx-pl>li .n{transition:color .4s ease}
#app .sx-pl>li b{transition:transform .5s cubic-bezier(.22,1,.36,1)}
#app .sx-pl>li.on>b{transform:translateX(6px)}
@media (prefers-reduced-motion:reduce){#app .sx-pl>li.on::after{animation:none;width:100%}}
@media (max-width:900px){#app .sx-pain{grid-template-columns:1fr !important}#app .pv-viz{margin-right:0;order:-1}}
@media (min-width:901px){#app .sx-pain:has(.sx-cs){align-items:start !important}#app .sx-pain:has(.sx-cs) .pv-viz{position:sticky !important;top:max(90px,calc(50vh - 300px)) !important}}
/* STUDIO Chapter 2: 레이어 카드에 1줄 설명, 카드 ↔ 목업 요소 1:1 하이라이트(양방향) */
#app .ch2-layers{gap:12px !important}
#app .ch2-layers li{display:flex;flex-direction:column;gap:8px;padding:20px 20px 22px !important;cursor:default;outline:none;transition:box-shadow .35s ease,background-color .35s ease}
#app .ch2-layers li b{font:700 16px/1.3 var(--kr);color:#fff}
#app .ch2-layers li b span{font:600 13px/1 var(--en);color:rgba(255,255,255,.5)}
#app .ch2-layers li p{margin:0;font:400 13.5px/1.6 var(--kr);color:#888;text-wrap:pretty}
#app .ch2-layers li:hover,#app .ch2-layers li:focus-visible{box-shadow:inset 0 0 0 1px rgba(253,69,51,.8) !important;background:rgba(253,69,51,.06)}
#app .ch2 .ly{transition:opacity .35s ease,box-shadow .35s ease,filter .35s ease}
#app .ch2:has(.ch2-layers li:is(:hover,:focus-visible)) .ly{opacity:.25}
#app .ch2:has(li[data-l=bg]:is(:hover,:focus-visible)) .ly-bg,#app .ch2:has(li[data-l=pr]:is(:hover,:focus-visible)) .ly-pr,#app .ch2:has(li[data-l=tx]:is(:hover,:focus-visible)) .ly-tx,#app .ch2:has(li[data-l=cta]:is(:hover,:focus-visible)) .ly-cta{opacity:1;box-shadow:0 0 0 2px #fd4533,0 0 24px rgba(253,69,51,.35)}
#app .ch2 .ly{cursor:pointer}
#app .ch2:has(.ly-bg:hover) li[data-l=bg],#app .ch2:has(.ly-pr:hover) li[data-l=pr],#app .ch2:has(.ly-tx:hover) li[data-l=tx],#app .ch2:has(.ly-cta:hover) li[data-l=cta]{box-shadow:inset 0 0 0 1px rgba(253,69,51,.8) !important;background:rgba(253,69,51,.06)}
/* ===== STUDIO Chapter 3 v2: 이중 검수 — 트랙(정상 절차) · 카드 · 폰이 같은 상황(위치 = 세이프존 침범)을 가리킴 ===== */
#app .pv2 #ch-3 .hl .kc b .kc-kick,#app .kc-kick{display:block;margin:0 0 14px;font:700 12px/1 var(--en) !important;letter-spacing:.16em;color:#ff4522 !important}
#app .ch3-track{position:relative;margin-top:clamp(34px,3.6vw,52px)}
#app .ch3-badge{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin:0 0 14px;font:700 11.5px/1 var(--en);letter-spacing:.08em;color:rgba(255,255,255,.7)}
#app .ch3-badge i{width:7px;height:7px;border-radius:50%;background:#fd4533;box-shadow:0 0 0 0 rgba(253,69,51,.6);animation:qaPing 2s ease-out infinite}
@keyframes qaPing{to{box-shadow:0 0 0 8px rgba(253,69,51,0)}}
#app .ch3-flow{margin:0 !important}
#app .ch3-flow li{display:flex;flex-direction:column;gap:8px;padding:18px 16px 20px !important;background:none !important;border-radius:0 !important;box-shadow:none !important;border-top:2px solid rgba(255,255,255,.14)}
#app .ch3-flow li.is-done{border-top-color:rgba(255,255,255,.5)}
#app .ch3-flow li.is-now{border-top-color:#fd4533;background:linear-gradient(180deg,rgba(253,69,51,.09),transparent 80%) !important}
#app .ch3-flow li+li::before{display:none}
#app .ch3-flow em{margin:0 !important}
#app .ch3-flow li.is-now em{color:#fd4533}
#app .ch3-flow span{font:700 clamp(15px,1.15vw,17px)/1.3 var(--kr);color:#fff}
#app .ch3-flow small{font:400 13px/1.55 var(--kr);color:#888}
#app .ch3{margin-top:clamp(40px,4vw,60px)}
#app .ch3-checks li{display:flex;flex-direction:column;gap:8px;padding:22px 22px 24px !important}
#app .ch3-checks b{font-size:clamp(17px,1.35vw,20px) !important}
#app .ch3-checks b span{font:600 13px/1 var(--en);color:rgba(255,255,255,.5)}
#app .ch3-checks small{margin:0 !important;display:inline-flex !important;align-items:center;gap:6px;font:700 12px/1 var(--kr) !important;color:#7bd389 !important}
#app .ch3-checks li.warn small{color:#fd4533 !important}
#app .ch3-checks li.warn{box-shadow:inset 0 0 0 1px rgba(253,69,51,.55) !important;background:linear-gradient(180deg,rgba(253,69,51,.07),#1a1a1a 70%) !important}
#app .ch3-checks p{margin:2px 0 0;font:400 13.5px/1.6 var(--kr);color:#888;text-wrap:pretty}
/* 폰 목업: 제품이 상단 빗금(UI 위험 구역)에 닿은 상태 */
#app .dv3 .ch3-ph{top:9% !important;bottom:40% !important;box-shadow:0 0 0 2px #fd4533,0 0 22px rgba(253,69,51,.45);animation:phNudge 4s cubic-bezier(.22,1,.36,1) infinite}
@keyframes phNudge{0%,55%{transform:translateY(0)}70%,92%{transform:translateY(46%);box-shadow:0 0 0 2px #7bd389,0 0 18px rgba(123,211,137,.35)}100%{transform:translateY(0)}}
#app .dv3 .ch3-flag{top:4% !important;right:8px !important;left:auto;z-index:3;white-space:nowrap;font-size:10.5px !important}
#app .dv3 .ch3-top{background:repeating-linear-gradient(135deg,rgba(253,69,51,.42) 0 6px,rgba(253,69,51,.1) 6px 12px) !important}
@media (prefers-reduced-motion:reduce){#app .dv3 .ch3-ph{animation:none}#app .ch3-badge i{animation:none}}
@media (max-width:900px){#app .ch3-flow{grid-template-columns:1fr !important}}

/* ===== 기기 목업: 3D 실사풍(금속 테두리 · 유리 반사 · 원근 기울기 · 바닥 그림자), 빛은 은은하게 ===== */
#app .ch2-dev,#app .ch3{perspective:1600px}
#app .dv-phone{border-radius:46px !important;padding:11px !important;background:linear-gradient(150deg,#4a4b52 0%,#1a1a1e 18%,#0c0c0e 50%,#24252a 82%,#55565d 100%) !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),inset 0 0 0 3px #08080a,inset 0 0 0 4px rgba(255,255,255,.06),0 60px 90px -50px rgba(0,0,0,.95),0 26px 40px -24px rgba(0,0,0,.7),-18px 30px 60px -40px rgba(253,69,51,.18) !important;transform:rotateY(-16deg) rotateX(5deg) rotateZ(1deg);transform-style:preserve-3d;transition:transform .9s cubic-bezier(.22,1,.36,1)}
#app .dv-phone:hover{transform:rotateY(-6deg) rotateX(2deg)}
#app .dv-phone .dv-screen{border-radius:36px !important;background:#16161a !important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.8)}
#app .dv-phone::before{content:"";position:absolute;right:-3px;top:26%;width:3px;height:14%;border-radius:0 3px 3px 0;background:linear-gradient(90deg,#2a2b30,#5a5b62)}
#app .dv-phone::after{content:"";position:absolute;left:-3px;top:20%;width:3px;height:7%;border-radius:3px 0 0 3px;background:linear-gradient(270deg,#2a2b30,#5a5b62);box-shadow:0 52px 0 0 #3a3b41}
#app .dv-notch{width:30% !important;height:22px !important;top:20px !important;border-radius:14px !important;background:#000 !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
/* 유리 반사: 사선 하이라이트 한 줄 */
#app .dv .dv-screen::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;border-radius:inherit;background:linear-gradient(118deg,rgba(255,255,255,.11) 0%,rgba(255,255,255,.035) 34%,rgba(255,255,255,0) 34.5%,rgba(255,255,255,0) 100%)}
/* 노트북: 알루미늄 상판 테두리 + 은색 하판 */
#app .dv-lap{padding:12px 12px 16px !important;border-radius:18px 18px 4px 4px !important;background:linear-gradient(180deg,#2c2d32,#141417 12%,#0a0a0c) !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),inset 0 0 0 2px #050506,0 50px 70px -46px rgba(0,0,0,.95) !important;transform:rotateX(6deg) rotateY(-12deg);transform-origin:50% 100%;transition:transform .9s cubic-bezier(.22,1,.36,1)}
#app .dv-lap:hover{transform:rotateX(3deg) rotateY(-5deg)}
#app .dv-lap .dv-screen{border-radius:4px !important}
#app .dv-base{left:-9% !important;right:-9% !important;bottom:-16px !important;height:16px !important;border-radius:2px 2px 18px 18px !important;background:linear-gradient(180deg,#e4e5e8 0%,#b9bbc0 35%,#8d8f95 70%,#5f6166 100%) !important;box-shadow:0 22px 30px -16px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.7)}
#app .dv-base::before{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:18%;height:6px;border-radius:0 0 8px 8px;background:linear-gradient(180deg,#9a9ca2,#c9cbcf)}
/* 정사각 · 세로 피드 프레임: 얇은 기기 패널처럼 */
#app .dv-sq,#app .dv-port{background:linear-gradient(150deg,#3c3d43,#121215 30%,#0b0b0d 70%,#2e2f35) !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2),inset 0 0 0 3px #08080a,0 50px 80px -46px rgba(0,0,0,.95) !important;transform:rotateY(-12deg) rotateX(4deg);transition:transform .9s cubic-bezier(.22,1,.36,1)}
#app .dv-sq:hover,#app .dv-port:hover{transform:rotateY(-4deg) rotateX(2deg)}
@media (prefers-reduced-motion:reduce){#app .dv-phone,#app .dv-lap,#app .dv-sq,#app .dv-port{transition:none}}
#app .dv3 .ch3-flag{animation:flagSync 4s cubic-bezier(.22,1,.36,1) infinite}
@keyframes flagSync{0%,55%{opacity:1;transform:none}66%,94%{opacity:0;transform:translateY(-4px)}100%{opacity:1}}
@media (prefers-reduced-motion:reduce){#app .dv3 .ch3-flag{animation:none}}
/* 서비스 Process 배경: 사진의 검은 바탕판이 띠로 보이던 문제 — screen 합성으로 검정은 사라지고 바위 결만 남음, 위아래 · 좌우 모두 길게 사라짐 */
#app .pv2 #pv-how .ps-rocks{mix-blend-mode:screen;opacity:.9;inset:-6% 0 !important;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 34%,#000 66%,transparent 100%),linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%) !important;mask-image:linear-gradient(180deg,transparent 0,#000 34%,#000 66%,transparent 100%),linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%) !important;-webkit-mask-composite:source-in;mask-composite:intersect}
#app .pv2 #pv-how .ps-rk.rk-a img{filter:grayscale(1) brightness(.75) contrast(1.25) !important}
/* 히어로: 서비스명과 아이콘 사이 여유 */
@media (min-width:901px){
 #app .pv3-nmrow{gap:clamp(20px,2.6vw,48px) !important}
 #app .pv3-nmrow .pv3-icon{margin-left:0 !important}
 #app .p-desk .pv3-nmrow .pv3-icon{margin-left:calc(min(19vw,318px) * -.04) !important}
}
@media (max-width:900px){#app .pv3-nmrow{column-gap:14px !important}#app .pv3-nmrow .pv3-icon{margin-left:0 !important}}
@media (min-width:901px){#app .p-ads .pv3-nmrow .pv3-icon{margin-right:calc(min(14vw,234px) * -.34) !important}}
@media (min-width:901px) and (max-width:1400px){#app .p-ads .pv3-nmrow{gap:clamp(14px,1.6vw,22px) !important}#app .p-ads .pv3-nmrow .pv3-icon{margin-right:calc(min(14vw,234px) * -.42) !important}}

/* ===== STUDIO What it covers 확장도 v2: 단계 동기화 · 계보 하이라이트 · 신호 점 ===== */
#app .sx-ch>div,#app .sx-ob,#app .sx-track li{transition:opacity .5s ease,box-shadow .5s ease,background-color .5s ease,color .5s ease}
#app .sx-cap[data-st="1"] .sx-ch>div:not([data-s="1"]),#app .sx-cap[data-st="2"] .sx-ch>div:not([data-s="2"]),#app .sx-cap[data-st="3"] .sx-ch>div:not([data-s="3"]){opacity:.38}
#app .sx-cap[data-st="1"] .sx-ob:not([data-s="1"]),#app .sx-cap[data-st="2"] .sx-ob:not([data-s="2"]),#app .sx-cap[data-st="3"] .sx-ob:not([data-s="3"]){opacity:.45}
#app .sx-cap[data-st="1"] .sx-ob[data-s="1"],#app .sx-cap[data-st="2"] .sx-ob[data-s="2"],#app .sx-cap[data-st="3"] .sx-ob[data-s="3"]{box-shadow:inset 0 0 0 1px rgba(253,69,51,.7) !important}
#app .sx-track li:last-child{background:none !important;color:rgba(255,255,255,.7) !important}
#app .sx-cap[data-st="1"] .sx-track li[data-s="1"],#app .sx-cap[data-st="2"] .sx-track li[data-s="2"],#app .sx-cap[data-st="3"] .sx-track li[data-s="3"],#app .sx-cap[data-st="0"] .sx-track li[data-s="3"]{background:rgba(253,69,51,.14) !important;color:#fff !important}
#app .sx-cnt{font:700 12px/1 var(--en);font-style:normal;letter-spacing:.06em;color:rgba(255,255,255,.4);margin-top:2px}
#app .sx-cap[data-st="1"] [data-s="1"] .sx-cnt,#app .sx-cap[data-st="2"] [data-s="2"] .sx-cnt,#app .sx-cap[data-st="3"] [data-s="3"] .sx-cnt{color:#fd4533}
/* 층별 밝기: 지금 단계까지만 또렷 */
#app .sx-svg .sx-l1,#app .sx-svg .sx-g2,#app .sx-svg .sx-l2,#app .sx-svg .sx-g3,#app .sx-svg .sx-pz{transition:opacity .45s ease}
#app .sx-cap[data-st="1"] .sx-svg :is(.sx-l1,.sx-g2){opacity:.35}
#app .sx-cap:is([data-st="1"],[data-st="2"]) .sx-svg :is(.sx-l2,.sx-g3){opacity:.25}
#app .sx-glow{fill:rgba(253,69,51,.16);transform-origin:200px 210px;animation:sxGlow 2.6s ease-in-out infinite}
@keyframes sxGlow{0%,100%{transform:scale(.7);opacity:.2}50%{transform:scale(1.15);opacity:.8}}
/* 신호 점 */
#app .sx-pz{fill:#fd4533;opacity:0;filter:drop-shadow(0 0 4px rgba(253,69,51,.8))}
#app .sx-cap.in .sx-pz{opacity:.9}
#app .sx-cap:is([data-st="1"],[data-st="2"]) .sx-pz{opacity:.35}
/* 호버 대상 */
#app .sx-hit{fill:transparent;stroke:none}
#app .sx-g2,#app .sx-g3{cursor:pointer;outline:none}
#app .sx-g2 .sx-n2{transition:r .3s ease,fill .3s ease}
#app .sx-g2:is(:hover,:focus-visible) .sx-n2{fill:#fd4533;r:15}
#app .sx-g2:focus-visible .sx-t2{text-decoration:underline}
#app .sx-g3:hover .sx-n3{fill:#fd4533}
#app .sx-g3:hover .sx-t3{fill:#fff}
#app .sx-cap[data-fa] .sx-svg [data-a]{transition:opacity .3s ease}
#app .sx-cap[data-fa] .sx-l1:is([data-a]),#app .sx-cap[data-fa] .sx-l2{stroke-width:2}
#app .sx-cap[data-fa] .sx-svg .sx-l2:not([style*="opacity"]){stroke:rgba(255,255,255,.55)}
#app .sx-focus{min-height:1.6em;margin:-6px 0 14px;text-align:center;font:500 14px/1.6 var(--kr);color:rgba(255,255,255,.6)}
#app .sx-focus b{color:#fff;font-weight:700}
#app .sx-cap[data-fa="0"] .sx-svg [data-a]:not([data-a="0"]){opacity:.1 !important}
#app .sx-cap[data-fa="1"] .sx-svg [data-a]:not([data-a="1"]){opacity:.1 !important}
#app .sx-cap[data-fa="2"] .sx-svg [data-a]:not([data-a="2"]){opacity:.1 !important}
#app .sx-cap[data-fb="0"] .sx-svg :is(.sx-l2,.sx-g3,.sx-pz):not([data-b="0"]){opacity:.1 !important}
#app .sx-cap[data-fb="1"] .sx-svg :is(.sx-l2,.sx-g3,.sx-pz):not([data-b="1"]){opacity:.1 !important}
#app .sx-cap[data-fb="2"] .sx-svg :is(.sx-l2,.sx-g3,.sx-pz):not([data-b="2"]){opacity:.1 !important}
#app .sx-cap[data-fb="3"] .sx-svg :is(.sx-l2,.sx-g3,.sx-pz):not([data-b="3"]){opacity:.1 !important}
#app .sx-cap[data-fb="4"] .sx-svg :is(.sx-l2,.sx-g3,.sx-pz):not([data-b="4"]){opacity:.1 !important}
#app .sx-cap[data-fb="5"] .sx-svg :is(.sx-l2,.sx-g3,.sx-pz):not([data-b="5"]){opacity:.1 !important}
#app .sx-cap[data-fb="6"] .sx-svg :is(.sx-l2,.sx-g3,.sx-pz):not([data-b="6"]){opacity:.1 !important}
#app .sx-cap[data-fb="7"] .sx-svg :is(.sx-l2,.sx-g3,.sx-pz):not([data-b="7"]){opacity:.1 !important}
#app .sx-cap[data-fb="8"] .sx-svg :is(.sx-l2,.sx-g3,.sx-pz):not([data-b="8"]){opacity:.1 !important}
@media (prefers-reduced-motion:reduce){#app .sx-pz{display:none}#app .sx-glow{animation:none}}
@media (max-width:900px){#app .sx-cap[data-st] .sx-ch>div,#app .sx-cap[data-st] .sx-ob{opacity:1}#app .sx-focus{display:none}}
/* ===== DESK 사례 예시 화면: 실제 기기 안에(모니터 + 브라우저 / 휴대폰 앱 · 메신저) ===== */
@media (min-width:1101px){
 #app #desk-cases .rfx-panel{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr) !important;grid-template-areas:"head head" "shot body" !important;column-gap:clamp(28px,3.4vw,56px) !important;align-items:center !important}
 #app #desk-cases .rfx-panel:has(.rfx-ph,.rfx-msg){grid-template-columns:auto minmax(0,1fr) !important}
}
#app #desk-cases .rfx-shot{background:none !important;box-shadow:none !important;padding:0 !important;border-radius:0 !important;display:flex;flex-direction:column;align-items:center;max-width:none !important}
#app #desk-cases .rfx-cap{align-self:stretch;margin-bottom:14px !important}
#app .dvx{position:relative}
/* 모니터 */
#app .dvx-mon{width:100%;max-width:640px;display:flex;flex-direction:column;align-items:center}
#app .dvx-mon .dvx-scr{width:100%;aspect-ratio:16/10;display:flex;flex-direction:column;overflow:hidden;border:11px solid #0c0c0e;border-bottom-width:14px;border-radius:16px;background:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.16),0 0 0 2px #050506,0 46px 70px -40px rgba(0,0,0,.95);position:relative}
#app .dvx-mon .dvx-scr::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(118deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 32%);z-index:5}
#app .dvx-chrome{display:flex;align-items:flex-end;gap:14px;height:30px;padding:0 12px;background:#e9e9ec;flex:none}
#app .dvx-tl{display:flex;gap:6px;align-self:center}
#app .dvx-tl i{width:9px;height:9px;border-radius:50%;background:#ff5f57}#app .dvx-tl i:nth-child(2){background:#febc2e}#app .dvx-tl i:nth-child(3){background:#28c840}
#app .dvx-tab{padding:6px 14px;border-radius:8px 8px 0 0;background:#fff;font:600 11px/1 var(--kr);color:#333 !important;white-space:nowrap}
#app .dvx-url{display:flex;align-items:center;gap:8px;margin:0;padding:6px 12px;background:#fff;border-bottom:1px solid #ececef;font:500 11px/1.4 var(--kr);color:#555 !important;flex:none}
#app .dvx-url::before{content:"";flex:none;width:0}
#app .dvx-lock{width:8px;height:7px;border-radius:2px;background:#9a9ca2;position:relative;margin-right:2px}
#app .dvx-lock::before{content:"";position:absolute;left:1px;top:-4px;width:6px;height:5px;border:1.5px solid #9a9ca2;border-bottom:0;border-radius:4px 4px 0 0;box-sizing:border-box}
#app .dvx-mon .dvx-body{flex:1;min-height:0;overflow:hidden;padding:16px 18px;background:#fff}
#app .dvx-neck{width:16%;height:clamp(30px,3.2vw,46px);background:linear-gradient(90deg,#8d8f95,#d9dadd 45%,#a9abb0 70%,#77797f)}
#app .dvx-foot{width:36%;height:9px;border-radius:3px 3px 10px 10px;background:linear-gradient(180deg,#e2e3e6,#9a9ca2);box-shadow:0 18px 26px -12px rgba(0,0,0,.9)}
/* 휴대폰 */
#app .dvx-ph{width:min(100%,300px);aspect-ratio:9/19.3;padding:10px;border-radius:50px;background:linear-gradient(150deg,#4a4b52 0%,#1a1a1e 18%,#0c0c0e 50%,#24252a 82%,#55565d 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),inset 0 0 0 3px #08080a,0 50px 80px -44px rgba(0,0,0,.95)}
#app .dvx-ph::before{content:"";position:absolute;right:-3px;top:24%;width:3px;height:13%;border-radius:0 3px 3px 0;background:linear-gradient(90deg,#2a2b30,#5a5b62)}
#app .dvx-ph .dvx-scr{position:relative;height:100%;border-radius:40px;overflow:hidden;background:#fff;display:flex;flex-direction:column}
#app .dvx-ph .dvx-scr::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(118deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,0) 30%);z-index:5}
#app .dvx-island{position:absolute;top:20px;left:50%;transform:translateX(-50%);width:30%;height:24px;border-radius:14px;background:#000;z-index:6}
#app .dvx-sb{display:flex;justify-content:space-between;align-items:center;padding:16px 26px 6px;flex:none}
#app .dvx-sb b{font:700 13px/1 var(--en);color:#111 !important}
#app .dvx-sb span{display:flex;gap:5px;align-items:center}
#app .dvx-sig{width:14px;height:9px;background:linear-gradient(90deg,#111 0 20%,transparent 20% 27%,#111 27% 47%,transparent 47% 54%,#111 54% 74%,transparent 74% 81%,#111 81%);clip-path:polygon(0 70%,25% 70%,25% 50%,52% 50%,52% 25%,79% 25%,79% 0,100% 0,100% 100%,0 100%)}
#app .dvx-wifi{width:12px;height:9px;border-radius:12px 12px 0 0;background:#111;clip-path:polygon(50% 100%,0 20%,100% 20%)}
#app .dvx-bat{width:20px;height:9px;border-radius:3px;box-shadow:inset 0 0 0 1.3px #111;background:linear-gradient(90deg,#111 0 70%,transparent 70%);background-clip:content-box;padding:2px;box-sizing:border-box}
#app .dvx-app{display:grid;grid-template-columns:24px 1fr 24px;align-items:center;padding:8px 14px 10px;border-bottom:1px solid #eee;flex:none}
#app .dvx-app span,#app .dvx-app i{font:400 22px/1 var(--en);font-style:normal;color:#111 !important}
#app .dvx-app i{font-size:16px;text-align:right}
#app .dvx-app b{text-align:center;font:700 14px/1.2 var(--kr);color:#111 !important}
#app .dvx-ph .dvx-body{flex:1;min-height:0;overflow:hidden;padding:12px 12px 16px}
/* 기기 안 예시 콘텐츠: 원래 상자 · 바탕 제거, 글자 크기 맞춤 */
#app .dvx-body>.chat,#app .dvx-body>.rfm{background:none !important;box-shadow:none !important;padding:0 !important;border-radius:0 !important;border:0 !important;max-width:none !important;width:100% !important;margin:0 !important}
#app .dvx-body .rfm-url{display:none !important}
#app .dvx-ph .chat .bub{font-size:13px !important;padding:10px 12px !important;max-width:88% !important}
#app .dvx-ph .chat .bub.a small{font-size:10.5px !important}
#app .dvx-ph .rfm-site .rfm-sk{padding:10px !important}
#app .dvx-ph .rfm-b{font-size:12.5px !important}
#app .dvx-mon .chat .bub{font-size:13.5px !important}
/* 메신저 대화창 */
#app .dvx-ph.is-msg .dvx-scr,#app .dvx-ph.is-msg .dvx-app{background:#bccfe0}
#app .dvx-ph.is-msg .dvx-app{border-bottom-color:rgba(0,0,0,.06)}
#app .msn{display:flex;flex-direction:column;gap:10px}
#app .msn-day{align-self:center;margin:0 0 2px;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.12);font:500 10.5px/1 var(--kr);color:#fff !important}
#app .msn-row{display:flex;gap:7px;align-items:flex-start}
#app .msn-row.is-me{justify-content:flex-end;align-items:flex-end}
#app .msn-av{flex:none;width:32px;height:32px;border-radius:12px;background:#fd4533;display:grid;place-items:center;font:800 13px/1 var(--en);font-style:normal;color:#fff !important}
#app .msn-nm{display:block;margin:0 0 4px;font:500 11px/1 var(--kr);color:#3a4652 !important}
#app .msn-row>div{display:flex;flex-direction:column;align-items:flex-start;max-width:82%}
#app .msn-b{padding:9px 11px;border-radius:4px 14px 14px 14px;background:#fff;font:500 12.5px/1.5 var(--kr);color:#111 !important;box-shadow:0 1px 1px rgba(0,0,0,.06)}
#app .msn-b b{color:#e0301f !important;font-weight:700}
#app .msn-row.is-me .msn-b{border-radius:14px 4px 14px 14px;background:#fde74c;max-width:78%}
#app .msn-tm{margin-top:3px;font:400 9.5px/1 var(--kr);color:#55606b !important}
#app .msn-row.is-me .msn-tm{margin:0 0 2px}
#app .msn-card{width:100%;min-width:190px}
#app .msn-card .msn-t{margin:0 0 8px;font:700 12px/1.4 var(--kr);color:#111 !important}
#app .msn-card ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
#app .msn-card li{display:grid;grid-template-columns:56px 1fr;align-items:center;gap:6px;font:500 11px/1 var(--kr);color:#333 !important}
#app .msn-card li i{height:7px;border-radius:4px;background:linear-gradient(90deg,#c9ccd2 var(--w),#f0f1f3 var(--w))}
#app .msn-card li.is-top i{background:linear-gradient(90deg,#fd4533 var(--w),#f0f1f3 var(--w))}
#app .msn-card li.is-top span{font-weight:700;color:#111 !important}
#app .msn-k{margin:8px 0 0;padding-top:7px;border-top:1px solid #eee;font:700 11px/1.3 var(--kr);color:#e0301f !important}
#app .dvx-input{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 10px 14px;padding:8px 8px 8px 14px;border-radius:999px;background:#fff;flex:none}
#app .dvx-input span{font:500 11.5px/1 var(--kr);color:#999 !important}
#app .dvx-input i{width:24px;height:24px;border-radius:50%;background:#fde74c;display:grid;place-items:center;font:700 12px/1 var(--en);font-style:normal;color:#111 !important}
@media (max-width:1100px){#app #desk-cases .rfx-panel{grid-template-columns:minmax(0,1fr) !important;grid-template-areas:"head" "shot" "body" !important}}
@media (min-width:1101px){
 #app #desk-cases .rfx-panel:has(.rfx-ph,.rfx-msg){grid-template-columns:minmax(300px,340px) minmax(0,1fr) !important}
 #app #desk-cases .rfx-panel:has(.rfx-mon){grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr) !important}
}
#app .dvx-mon .dvx-scr::after{background:linear-gradient(118deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,0) 30%)}
#app .dvx-mon .dvx-body{padding:12px 14px}
#app .dvx-mon .chat{gap:8px !important}
#app .dvx-mon .chat .bub{font-size:12.5px !important;padding:9px 12px !important}
#app .dvx-mon .rfm-card{padding:10px 12px !important}
/* 휴대폰 안 모바일 웹: 한 단으로 */
#app .dvx-ph .rfm-pg{display:flex !important;flex-direction:column !important;gap:10px !important;grid-template-columns:none !important}
#app .dvx-ph .rfm-sk{height:auto !important;min-height:0 !important;padding:10px 12px !important;display:flex !important;align-items:center;justify-content:space-between;gap:10px;border-radius:12px !important;background:linear-gradient(120deg,#fff1ee,#fff) !important}
#app .dvx-ph .rfm-sk p{margin:0 !important;font:700 11.5px/1.4 var(--kr) !important}
#app .dvx-ph .rfm-sk div{display:flex !important;gap:4px;margin:0 !important}
#app .dvx-ph .rfm-sk div i{width:20px !important;height:26px !important;border-radius:6px}
#app .dvx-ph .rfm-agent{padding:10px !important;border:0 !important;box-shadow:none !important;background:none !important}
#app .dvx-ph .rfm-b{max-width:92% !important;padding:8px 10px !important}
#app .dvx-ph .rfm-recs{display:flex !important;gap:6px;flex-wrap:wrap}
#app .dvx-body>.chat,#app .dvx-body>.rfm,#app .dvx-body>.chat *,#app .dvx-body>.rfm>*{outline:0}
#app .dvx-body>.chat::before,#app .dvx-body>.chat::after,#app .dvx-body>.rfm::before,#app .dvx-body>.rfm::after{display:none !important}
#app .dvx-body>.chat,#app .dvx-body>.rfm{border:0 !important;box-shadow:none !important}
#app .dvx-input.is-app{background:#f2f2f5;margin-top:auto}
#app .dvx-input.is-app i{background:#111;color:#fff !important}
#app .dvx-mon .dvx-body>*{zoom:.84}
@media (max-width:700px){#app .dvx-mon .dvx-scr{aspect-ratio:4/3.4;border-width:8px 8px 10px}#app .dvx-mon .dvx-body>*{zoom:.72}#app .dvx-ph{width:min(100%,280px)}}
#app #desk-cases .rfx-shot .dvx-body>.chat,#app #desk-cases .rfx-shot .dvx-body>.rfm{background:none !important;box-shadow:none !important;border:0 !important;border-radius:0 !important;padding:0 !important;outline:0 !important}
/* 서비스 What We Do: 어바웃 How we work와 같은 결(스크롤 고정 · 영문 단어 스택 · 오른쪽 해설 전환) */
#app #pv-wd{padding-bottom:0 !important}
#app #pv-wd .hl{margin-bottom:0 !important}
#app .pv-hw .hw-stick{overflow:visible}
#app .pv-hw .hw-stick>canvas.dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#app .pv-hw .hw-grid{position:relative;z-index:1;margin-top:0}
#app .pv-hw .hw-copy{min-height:300px}
@media (max-width:899px){#app .pv-hw{height:auto !important}#app .pv-hw .hw-stick{position:static;height:auto;padding:40px 0 80px}}
#app .pv-hw .hw-stick{height:100vh !important;justify-content:center !important;padding-top:64px}
@media (max-width:899px){#app .pv-hw .hw-stick{height:auto !important;padding:24px 0 72px !important;justify-content:flex-start !important}}
/* ===== 서비스 Sound Familiar? v3: 메인 Your Start 결 — 왼쪽 큰 문장 · 오른쪽 도트 그림 · 아래 진행 탭 ===== */
#app .pv-ys{margin-top:clamp(20px,2.4vw,36px)}
#app .pv-ys .ys-stage{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr) !important;align-items:center !important;min-height:clamp(380px,34vw,520px) !important;padding-bottom:clamp(28px,3vw,44px);border-bottom:0}
#app .pv-ys .ys-q{align-self:center !important}
#app .pv-ys .ys-qi{font:inherit !important;display:block}
#app .pv-ys .ys-qi .ys-l{display:block;margin:0 0 18px;font:600 clamp(15px,1.15vw,17px)/1.3 var(--kr) !important;color:#fd4533 !important;letter-spacing:-.01em}
#app .pv-ys .pv-ys-s{margin:0;font:300 clamp(28px,2.9vw,44px)/1.34 var(--kr) !important;letter-spacing:-.05em;color:rgba(255,255,255,.88) !important;text-wrap:balance}
#app .pv-ys .pv-ys-s b{font-weight:800 !important;color:#fff !important}
#app .pv-ys .sx-cs{margin-top:clamp(22px,2.4vw,32px) !important;max-width:620px;grid-column:auto !important}
#app .pv-ys .sx-cs li{display:grid !important;grid-template-columns:minmax(0,1fr) auto;gap:16px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.1)}
#app .pv-ys .sx-cs-a{color:#fd4533 !important}
#app .pv-ys-ans{align-self:center !important;gap:10px !important}
#app .pv-ys-ans .pv-viz{margin:0 !important;position:relative !important;top:auto !important}
#app .pv-ys-ans .pv-viz canvas{width:100% !important;aspect-ratio:4/3}
#app .pv-ys-tabs{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
#app .pv-ys-tabs .ys-t{font-size:clamp(14px,1.05vw,16px) !important}
@media (max-width:900px){#app .pv-ys .ys-stage{grid-template-columns:1fr !important;min-height:0 !important}#app .pv-ys-ans{grid-row:1 !important}#app .pv-ys-tabs{grid-template-columns:1fr !important}#app .pv-ys .pv-ys-s{font-size:24px !important}}
@media (max-width:900px){#app .pv-ys .ys-stage{grid-template-rows:auto auto !important;gap:18px !important}#app .pv-ys .pv-ys-ans{grid-column:1 !important;grid-row:1 !important}#app .pv-ys .ys-q{grid-column:1 !important;grid-row:2 !important}#app .pv-ys .pv-ys-ans .pv-viz{max-width:320px;margin:0 auto !important}#app .pv-ys .sx-cs li{grid-template-columns:1fr !important;gap:4px}}
#app .pv2 :is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case) .hl{margin-bottom:clamp(52px,5.4vw,88px) !important}
#app .pv2 .hl:not(:is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case) .hl){margin-bottom:clamp(64px,7vw,124px) !important}#app #pv-wd .hl{margin-bottom:0 !important}
/* 소제목 섹션의 작은 라벨: 제목과 같이 왼쪽 정렬 */
#app .pv2 :is(#sx-cover,#sx-made,#desk-cases,#desk-trust,#desk-next,#desk-ask,#grow-funnel,#grow-daily,#grow-case) .section-index{text-align:left !important;justify-content:flex-start !important;margin-left:0 !important;margin-right:auto !important;width:auto !important;display:flex !important;margin-bottom:clamp(14px,1.4vw,20px) !important}
/* ===== DESK The Next Box v2: 위 4열 · 아래 3열(07은 2칸), 카드마다 구축 아키텍처 배지, 07은 의뢰 버튼 ===== */
#app .dn-v2{grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:12px !important}
#app .dn-v2 .dn-c{min-height:0 !important;padding:22px 20px 20px !important;gap:12px}
#app .dn-v2 .dn-c small{color:#fff !important;font:500 14.5px/1.55 var(--kr) !important}
#app .dn-arc{display:flex;gap:6px;margin-top:auto;padding:10px 12px;border-radius:8px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);font:500 12px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.01em;color:#888 !important}
#app .dn-arc i{font-style:normal;color:#fd4533}
#app .dn-v2 .dn-empty{grid-column:span 2;display:flex;flex-direction:column;gap:12px;background:linear-gradient(135deg,rgba(253,69,51,.07),transparent 60%) !important}
#app .dn-v2 .dn-empty .dn-t{font:800 clamp(18px,1.5vw,22px)/1.3 var(--kr) !important}
#app .dn-v2 .dn-empty .dn-t span{font:700 .62em/1 var(--en);letter-spacing:.08em;color:#fd4533}
#app .dn-v2 .dn-s{margin:0;font:500 15px/1.7 var(--kr);color:rgba(255,255,255,.8)}
#app .dn-v2 .dn-s i{font-style:normal;display:inline-block;margin:0 2px;padding:2px 10px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);font-weight:700;color:#fff}
#app .dn-cta{all:unset;box-sizing:border-box;margin-top:auto;display:flex;align-items:center;justify-content:space-between;width:100%;padding:14px 18px;border-radius:10px;background:#ff4522;font:700 15px/1 var(--kr);color:#fff;cursor:pointer;transition:background-color .3s ease}
#app .dn-cta span{transition:transform .3s ease}
#app .dn-cta:hover{background:#e63a18}#app .dn-cta:hover span{transform:translateX(4px)}
#app .dn-cta:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media (max-width:900px){#app .dn-v2{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media (max-width:560px){#app .dn-v2{grid-template-columns:1fr !important}#app .dn-v2 .dn-empty{grid-column:auto}}
/* ===== STUDIO Made differently v2: 끌어서 비교 → BEFORE / AFTER 나란히 그림 ===== */
#app .stx{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:stretch;gap:0;border-radius:16px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
#app .stx-side{display:flex;flex-direction:column;gap:16px;padding:clamp(24px,2.6vw,38px)}
#app .stx-b{background:#141416}
#app .stx-a{background:linear-gradient(160deg,rgba(253,69,51,.1),#17171a 60%)}
#app .stx-k{margin:0;font:700 11.5px/1 var(--en);letter-spacing:.14em;color:rgba(255,255,255,.4)}
#app .stx-a .stx-k{color:#fd4533}
#app .stx-viz{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:clamp(170px,15vw,220px);padding:18px;border-radius:12px;background:rgba(255,255,255,.025)}
#app .stx-t{margin:0;font:600 clamp(17px,1.4vw,21px)/1.5 var(--kr);letter-spacing:-.03em;color:rgba(255,255,255,.55);text-wrap:balance}
#app .stx-a .stx-t{color:#fff;font-weight:700}
#app .stx-ar{position:relative;display:grid;place-items:center;width:clamp(44px,4vw,64px);font:700 20px/1 var(--en);color:#fd4533;background:linear-gradient(90deg,#141416 50%,#17171a 50%)}
#app .stx-ar i{position:absolute;top:0;bottom:0;left:50%;width:1px;background:rgba(253,69,51,.35)}
#app .stx-ar{z-index:1}
#app .v-cap{margin:0;font:600 12px/1 var(--kr);color:rgba(255,255,255,.45)}
#app .stx-a .v-cap{color:#fd4533}
@keyframes vIn{from{opacity:0;transform:translateY(8px) scale(.94)}}
@keyframes vGrow{from{height:0}}
/* 01 시안 고르기 */
#app .v-pick{display:flex;gap:12px}
#app .v-pick i{width:56px;height:72px;border-radius:8px;background:#2a2a2e;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
#app .v-pick i.is-p{box-shadow:inset 0 0 0 2px rgba(255,255,255,.55);background:#38383d}
#app .v-grid{display:grid;grid-template-columns:repeat(6,28px);gap:8px}
#app .v-grid i{position:relative;height:56px;border-radius:5px;background:#2b2b30;overflow:hidden;animation:vIn .5s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--k)*.04s)}
#app .v-grid i b{position:absolute;left:0;right:0;bottom:0;height:var(--h);background:rgba(255,255,255,.22);animation:vGrow .9s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(.4s + var(--k)*.04s)}
#app .v-grid i.is-w{box-shadow:0 0 0 2px #fd4533,0 0 16px rgba(253,69,51,.45)}
#app .v-grid i.is-w b{background:#fd4533}
/* 02 사람마다 다른 화면 */
#app .v-ppl{display:flex;gap:18px}
#app .v-ppl span{display:flex;flex-direction:column;align-items:center;gap:8px}
#app .v-ppl em{width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.35);box-shadow:0 22px 0 -4px rgba(255,255,255,.2)}
#app .v-pg{display:grid;place-items:center;width:58px;height:74px;margin-top:10px;border-radius:7px;background:#2a2a2e;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
#app .v-ppl.is-a span{animation:vIn .5s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--k)*.12s)}
#app .v-ppl.is-a em{background:#fff}
#app .v-pg b{font:800 18px/1 var(--en);color:#fff}
#app .v-pg0{background:linear-gradient(160deg,#fd4533,#7a1f15)}
#app .v-pg1{background:linear-gradient(160deg,#e9e9ec,#7e7f86)}#app .v-pg1 b{color:#111}
#app .v-pg2{background:linear-gradient(160deg,#3b3b42,#17171a);box-shadow:inset 0 0 0 1.5px #fd4533}
/* 03 체험형 */
#app .v-doc{display:flex;flex-direction:column;gap:8px;width:160px;padding:16px;border-radius:8px;background:#2a2a2e}
#app .v-doc i{height:6px;border-radius:3px;background:rgba(255,255,255,.22)}#app .v-doc i.s{width:60%}
#app .v-quiz{display:flex;align-items:center;gap:12px}
#app .v-quiz>span{animation:vIn .5s cubic-bezier(.22,1,.36,1) both}
#app .v-in,#app .v-res{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:10px;background:#2a2a2e;min-width:96px}
#app .v-in i{height:22px;border-radius:6px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4);background:#1d1d20}
#app .v-in b,#app .v-res b{font:700 11px/1.3 var(--kr);color:rgba(255,255,255,.8)}
#app .v-arr{font:700 18px/1 var(--en);color:#fd4533;animation-delay:.25s !important}
#app .v-res{box-shadow:inset 0 0 0 1.5px #fd4533;animation-delay:.45s !important}
#app .v-res i{height:6px;border-radius:3px;background:#fd4533}#app .v-res i+i{width:70%;background:rgba(255,255,255,.4)}
/* 04 촬영 없이 */
#app .v-line{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:center}
#app .v-line span{padding:8px 10px;border-radius:999px;background:#2a2a2e;font:600 11.5px/1 var(--kr);color:rgba(255,255,255,.6)}
#app .v-line i{width:14px;height:1px;background:rgba(255,255,255,.25)}
#app .v-ai{display:flex;align-items:center;gap:12px}
#app .v-src{padding:9px 12px;border-radius:999px;background:#2a2a2e;font:600 11.5px/1 var(--kr);color:#fff}
#app .v-core{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fd4533;font:800 14px/1 var(--en);color:#fff;box-shadow:0 0 0 6px rgba(253,69,51,.15);animation:vIn .5s cubic-bezier(.22,1,.36,1) .15s both}
#app .v-out{display:grid;grid-template-columns:repeat(3,22px);gap:6px}
#app .v-out i{height:28px;border-radius:4px;background:linear-gradient(160deg,#e9e9ec,#6d6e75);animation:vIn .45s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(.35s + var(--k)*.07s)}
#app .v-out i:nth-child(2n){height:22px;background:linear-gradient(160deg,#fd4533,#7a1f15)}
@media (prefers-reduced-motion:reduce){#app .stx *{animation:none !important}}
@media (max-width:820px){#app .stx{grid-template-columns:1fr}#app .stx-ar{width:auto;height:40px;background:#141416}#app .stx-ar i{left:0;right:0;top:50%;bottom:auto;width:auto;height:1px}#app .stx-ar{font-size:0}#app .stx-ar::after{content:"↓";font:700 18px/1 var(--en);color:#fd4533;position:relative}}
/* ===== 서비스 Pick one 벤 정리: 왼쪽 그림 · 오른쪽 이 서비스의 두 조합 목록 + AX ONE ===== */
#app .pvs{display:grid !important;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr) !important;grid-template-areas:none !important;align-items:center !important;gap:clamp(32px,5vw,80px) !important;position:relative}
#app .pvs>.syn-fig{grid-column:1 !important;grid-row:1 !important;position:relative !important;width:100% !important;max-width:560px;margin:0 auto !important}
#app .pvs-side{grid-column:2;grid-row:1;display:flex;flex-direction:column;gap:22px}
#app .pvs-k{margin:0;font:700 12px/1 var(--en);letter-spacing:.16em;text-transform:uppercase;color:#fd4533}
#app .pvs-list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.14)}
#app .pvs .syn-info{position:static !important;inset:auto !important;transform:none !important;opacity:1 !important;width:auto !important;max-width:none !important;margin:0 !important;padding:0 !important;text-align:left !important;background:none !important;box-shadow:none !important;border-bottom:1px solid rgba(255,255,255,.14)}
#app .pvs .syn-info a{position:relative;display:grid;gap:8px;padding:22px 44px 24px 0;text-decoration:none;color:inherit}
#app .pvs .syn-info span{font:700 11.5px/1 var(--en);letter-spacing:.14em;color:rgba(255,255,255,.5) !important}
#app .pvs .syn-info b{font:800 clamp(20px,1.8vw,26px)/1.3 var(--kr) !important;letter-spacing:-.035em;color:#fff !important}
#app .pvs .syn-info p{margin:0;font:400 15px/1.7 var(--kr) !important;color:rgba(255,255,255,.66) !important;text-align:left !important}
#app .pvs .syn-info i{position:absolute;right:4px;top:24px;font:400 18px/1 var(--en);font-style:normal;color:rgba(255,255,255,.4);transition:transform .35s ease,color .35s ease}
#app .pvs .syn-info:hover b{color:#fd4533 !important}
#app .pvs .syn-info:hover i{color:#fd4533;transform:translate(3px,-3px)}
#app .pvs .syn-info:hover span{color:#fd4533 !important}
#app .pvs-one{margin:0;font:500 14px/1.65 var(--kr);color:rgba(255,255,255,.6)}
#app .pvs-one a{margin-left:6px;color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4);white-space:nowrap}
#app .pvs-one a:hover{color:#fd4533;border-color:#fd4533}
#app .pvs .syn-go{position:static !important;transform:none !important;align-self:flex-start;margin:4px 0 0 !important}
#app .pvs>.syn-info,#app .pvs>.pair-row,#app .pvs>.pair-one{display:none !important}
/* 목록에 올리면 그림의 해당 교집합이 빛남 */
#app .pvs .sy-l{transition:opacity .35s ease,fill .35s ease}
#app .pvs:has(.si-ab:hover) .sy-l[data-l="ab"],#app .pvs:has(.si-ac:hover) .sy-l[data-l="ac"],#app .pvs:has(.si-bc:hover) .sy-l[data-l="bc"]{opacity:1 !important;fill:rgba(253,69,51,.7) !important}
#app .pvs:has(.si-ab:hover) .sy-k[data-k="ab"],#app .pvs:has(.si-ac:hover) .sy-k[data-k="ac"],#app .pvs:has(.si-bc:hover) .sy-k[data-k="bc"]{color:#fff;opacity:1}
@media (max-width:900px){#app .pvs{grid-template-columns:1fr !important}#app .pvs-side{grid-column:1;grid-row:2}}
/* ===== STUDIO Chapter 1 v3: 회사소개서 근거(Creative RAG) — 원 안 글자는 각 원의 바깥 잎 정중앙에 고정 ===== */
#app .ch1v .cv-wrap{position:relative !important;width:min(100%,520px) !important;aspect-ratio:1/1 !important;height:auto !important;padding:0 !important}
#app .cv4{padding:0 !important;display:block !important}
#app .cv4-l{position:absolute;width:54%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
#app .cv4-1 .cv4-l{left:39%;top:39%}#app .cv4-2 .cv4-l{left:61%;top:39%}
#app .cv4-3 .cv4-l{left:39%;top:61%}#app .cv4-4 .cv4-l{left:61%;top:61%}
#app .cv4-l .cv-ico{width:46px !important;height:36px !important;margin:0 0 2px !important}
#app .cv4-l small{font:700 10px/1 var(--en);letter-spacing:.12em;color:#fd4533}
#app .cv4-l b{font:800 clamp(15px,1.25vw,18px)/1.25 var(--kr) !important;letter-spacing:-.03em;color:#fff;max-width:none !important}
#app .cv4-l span{font:500 clamp(10.5px,.8vw,12px)/1.45 var(--kr);color:rgba(255,255,255,.6);word-break:keep-all;text-wrap:balance}
#app .cv4-core{left:36.5% !important;top:36.5% !important;width:27% !important}
#app .ch1-k{margin:0 0 14px;font:700 12.5px/1 var(--kr);letter-spacing:.02em;color:rgba(255,255,255,.55)}
#app .ch1-side{display:flex;flex-direction:column}
#app .ch1-rail{counter-reset:none}
#app .ch1-rail li{background:none !important;box-shadow:none !important;border-radius:0 !important;border-top:1px solid rgba(255,255,255,.1);padding:13px 4px !important}
#app .ch1-rail li:last-child{border-bottom:1px solid rgba(255,255,255,.1)}
#app .ch1-rail li.is-key{background:linear-gradient(90deg,rgba(253,69,51,.14),transparent 80%) !important;border-top-color:#fd4533}
#app .ch1-rail li.is-key b{color:#fd4533}
#app .ch1-cc{margin-top:18px}
#app .ch1-out{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:10px !important}
#app .ch1-out li{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 10px !important;border-radius:12px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);background:none}
#app .ch1-out li small{font:700 11px/1 var(--kr);color:rgba(255,255,255,.5)}
#app .ch1-out li span{font:800 16px/1 var(--kr);color:#fff}
#app .ch1-out li.is-use{box-shadow:inset 0 0 0 1.5px #fd4533;background:rgba(253,69,51,.1)}
#app .ch1-out li.is-use small{color:#fd4533}
#app .ch1-cn{margin:12px 0 0;font:400 13.5px/1.65 var(--kr);color:rgba(255,255,255,.62)}
#app .ch1-cn b{color:#fff;font-weight:700}
#app .ch1-who{display:none !important}
#app .ch1-who2{margin-top:clamp(40px,4.4vw,64px)}
#app .ch1-who2 ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.14)}
#app .ch1-who2 li{display:flex;flex-direction:column;gap:8px;padding:20px 24px 0 0}
#app .ch1-who2 li+li{padding-left:24px;border-left:1px solid rgba(255,255,255,.1)}
#app .ch1-who2 b{font:800 18px/1.2 var(--kr);color:#fff}
#app .ch1-who2 li span{font:400 14px/1.65 var(--kr);color:rgba(255,255,255,.66)}
#app .ch1-foot{margin:22px 0 0;font:500 12.5px/1.5 var(--kr);color:rgba(255,255,255,.42)}
@media (max-width:900px){#app .ch1-who2 ul{grid-template-columns:1fr}#app .ch1-who2 li+li{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.1)}#app .ch1-who2 li{padding:16px 0}}
@media (max-width:520px){#app .cv4-l span{display:none}#app .cv4-l .cv-ico{width:34px !important;height:28px !important}}
#app .ch1v .ch1-rail{padding-left:0 !important}#app .ch1v .ch1-rail::before,#app .ch1v .ch1-rail li::before{display:none !important}
/* ===== STUDIO Chapter 2 v3: 회사소개서 「제작」 전체 — 확장 5단계 · 위치 계산 · 비율/레이어 미리 보기 · 요소별 수정 3 · 이 크기만 다시 ===== */
#app .ch2-k{margin:0 0 14px;font:700 12.5px/1 var(--kr);color:rgba(255,255,255,.55)}
#app .ch2-k2,#app .ch2-k3{margin-top:clamp(40px,4.4vw,64px)}
#app .ch2-flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;border-top:1px solid rgba(255,255,255,.14)}
#app .ch2-flow li{position:relative;display:flex;flex-direction:column;gap:8px;padding:18px 20px 22px 0}
#app .ch2-flow li+li{padding-left:20px;border-left:1px solid rgba(255,255,255,.08)}
#app .ch2-flow li+li::before{content:"→";position:absolute;left:-7px;top:16px;font:400 13px/1 var(--en);color:rgba(255,255,255,.4);background:#1b1b1e;padding:2px 0}
#app .ch2-flow em{font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:rgba(255,255,255,.45)}
#app .ch2-flow b{font:800 17px/1.3 var(--kr);color:#fff}
#app .ch2-flow p{margin:0;font:400 13.5px/1.6 var(--kr);color:rgba(255,255,255,.62);word-break:keep-all}
#app .ch2-flow li.is-key{background:linear-gradient(180deg,rgba(253,69,51,.16),transparent 85%);box-shadow:inset 0 2px 0 #fd4533}
#app .ch2-flow li.is-key em,#app .ch2-flow li.is-key b{color:#fd4533}
#app .ch2-rt{display:flex;align-items:flex-end;gap:4px;height:22px}
#app .ch2-rt i{display:block;border:1.5px solid rgba(255,255,255,.55);border-radius:2px}
#app .ch2-rt .r1{width:16px;height:16px}#app .ch2-rt .r2{width:11px;height:20px}#app .ch2-rt .r3{width:14px;height:18px}#app .ch2-rt .r4{width:26px;height:14px}
#app .ch2-calc{display:flex;gap:16px;align-items:baseline;margin:18px 0 0;padding:14px 18px;border-left:2px solid #fd4533;background:rgba(255,255,255,.03);font:400 14px/1.6 var(--kr);color:rgba(255,255,255,.72)}
#app .ch2-calc b{flex:none;font-weight:800;color:#fff}
#app .ch2-edit{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.14)}
#app .ch2-edit li{display:flex;flex-direction:column;gap:8px;padding:20px 24px 0 0}
#app .ch2-edit li+li{padding-left:24px;border-left:1px solid rgba(255,255,255,.1)}
#app .ch2-edit b{font:800 18px/1.25 var(--kr);color:#fff}
#app .ch2-edit span{font:400 14px/1.65 var(--kr);color:rgba(255,255,255,.66)}
#app .ch2-redo{display:grid;grid-template-columns:minmax(160px,.3fr) 1fr;align-items:center;gap:24px;margin:clamp(28px,3vw,40px) 0 0;padding:20px 26px;border-radius:14px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
#app .ch2-redo b{font:800 18px/1.2 var(--kr);color:#fff}
#app .ch2-redo span{font:600 16px/1.5 var(--kr);color:rgba(255,255,255,.85)}
#app .ch2-foot{margin:16px 0 0;font:500 12.5px/1.5 var(--kr);color:rgba(255,255,255,.42)}
@media (max-width:1000px){#app .ch2-flow{grid-template-columns:1fr}#app .ch2-flow li+li{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.08)}#app .ch2-flow li+li::before{display:none}#app .ch2-flow li.is-key{padding-left:14px}#app .ch2-edit{grid-template-columns:1fr}#app .ch2-edit li+li{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.1)}#app .ch2-edit li{padding:16px 0}#app .ch2-redo{grid-template-columns:1fr;gap:6px}#app .ch2-calc{flex-direction:column;gap:4px}}
/* ===== STUDIO Chapter 3 v3: 회사소개서 「검증(매체 규격 자동 검증)」 흐름도 ===== */
#app .qf{margin-top:clamp(28px,3vw,44px)}
#app .qf-lead{margin:0 0 clamp(28px,3vw,40px);font:500 clamp(15px,1.15vw,17px)/1.7 var(--kr);color:rgba(255,255,255,.75)}
#app .qf-k{display:flex;align-items:baseline;gap:14px;margin:0 0 14px;font:700 12.5px/1 var(--kr);color:rgba(255,255,255,.55)}
#app .qf-k span{font-weight:500;color:#fd4533}
#app .qf-k2{margin-top:clamp(44px,4.6vw,68px)}
#app .qf-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) 56px minmax(0,.85fr) 120px minmax(0,1.25fr);grid-template-rows:auto 64px auto;align-items:stretch}
#app .qf-c{position:relative;display:flex;flex-direction:column;gap:8px;padding:20px 22px;border-radius:14px;background:#1a1a1d;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
#app .qf-c em{position:absolute;right:20px;top:20px;font:700 12px/1 var(--en);font-style:normal;color:rgba(255,255,255,.45)}
#app .qf-c b{font:800 clamp(17px,1.35vw,20px)/1.3 var(--kr);color:#fff;padding-right:28px}
#app .qf-c p{margin:0;font:400 14px/1.6 var(--kr);color:rgba(255,255,255,.66);word-break:keep-all}
#app .qf-1{grid-column:1;grid-row:1}
#app .qf-2{grid-column:3;grid-row:1}
#app .qf-6{grid-column:5;grid-row:1}
#app .qf-c.is-key{background:linear-gradient(150deg,#fd4533,#c9301f);box-shadow:none}
#app .qf-c.is-key em,#app .qf-c.is-key p{color:rgba(255,255,255,.92)}
#app .qf-c.is-key b{color:#fff}
/* 화살표 */
#app .qf-1::after{content:"";position:absolute;right:-50px;top:50%;width:44px;height:1px;background:rgba(255,255,255,.4)}
#app .qf-1::before{content:"";position:absolute;right:-50px;top:calc(50% - 4px);border:4px solid transparent;border-left:6px solid rgba(255,255,255,.55);border-right:0}
#app .qf-pass{grid-column:4;grid-row:1;align-self:center;position:relative;display:block;text-align:center;font:600 11.5px/1 var(--kr);color:rgba(255,255,255,.6);padding-bottom:12px}
#app .qf-pass::after{content:"";position:absolute;left:6px;right:6px;bottom:0;height:1px;background:#fd4533}
#app .qf-pass::before{content:"";position:absolute;right:2px;bottom:-4px;border:4px solid transparent;border-left:6px solid #fd4533;border-right:0}
#app .qf-loop-ar{grid-column:3;grid-row:2;position:relative}
#app .qf-loop-ar i{position:absolute;top:0;bottom:0;width:1px;background:rgba(255,255,255,.4)}
#app .qf-loop-ar i:first-child{left:42%}#app .qf-loop-ar i:last-child{left:58%}
#app .qf-loop-ar i:first-child::after{content:"";position:absolute;left:-4px;bottom:-2px;border:4px solid transparent;border-top:6px solid rgba(255,255,255,.55);border-bottom:0}
#app .qf-loop-ar i:last-child::after{content:"";position:absolute;left:-4px;top:-2px;border:4px solid transparent;border-bottom:6px solid rgba(255,255,255,.55);border-top:0}
#app .qf-loop{grid-column:1 / 4;grid-row:3;position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:14px;padding:26px 20px 20px;border-radius:18px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);background:rgba(255,255,255,.015)}
#app .qf-ll{position:absolute;left:20px;top:-8px;padding:0 8px;background:#1d1d20;font:600 11.5px/1.2 var(--kr);color:rgba(255,255,255,.55)}
#app .qf-loop .qf-c{background:#202024}
#app .qf-5{grid-column:5;grid-row:3;align-self:center}
#app .qf-5::before{content:"";position:absolute;left:-120px;top:50%;width:112px;height:1px;background:rgba(255,255,255,.4)}
#app .qf-5::after{content:"";position:absolute;left:-10px;top:calc(50% - 4px);border:4px solid transparent;border-left:6px solid rgba(255,255,255,.55);border-right:0}
#app .qf-5 b{color:#fff}
#app .qf-foot{margin:22px 0 0;font:500 13px/1.6 var(--kr);color:rgba(255,255,255,.5)}
#app .ch3-track{display:none !important}
@media (max-width:1000px){
 #app .qf-grid{grid-template-columns:1fr;grid-template-rows:none;gap:12px}
 #app .qf-grid>*{grid-column:1 !important;grid-row:auto !important}
 #app .qf-1::before,#app .qf-1::after,#app .qf-5::before,#app .qf-5::after{display:none}
 #app .qf-pass{text-align:left;padding:4px 0 10px}
 #app .qf-loop-ar{height:28px}
 #app .qf-loop{grid-template-columns:1fr}
 #app .qf-6{order:9}
}
#app .qf-k2+.ch3{margin-top:0 !important}
@media (max-width:1000px){#app .qf-pass{order:8}#app .qf-6{order:9}}
/* ===== STUDIO Chapter 4 v2: 회사소개서 「브랜드의 분신」 도식 (담는 것 → 분신 → 쓰이는 곳) ===== */
#app .ch4,#app .ch4-decide{display:none !important}
#app .bx{display:grid;grid-template-columns:minmax(0,1fr) 64px minmax(240px,.82fr) 64px minmax(0,1fr);align-items:center;margin-top:clamp(8px,1vw,16px)}
#app .bx-in{grid-column:1}#app .bx-core{grid-column:3}#app .bx-out{grid-column:5}
#app .bx-k{margin:0 0 12px;font:700 12.5px/1 var(--kr);color:rgba(255,255,255,.5)}
#app .bx-col ol,#app .bx-col ul{position:relative;list-style:none;margin:0;padding:0;display:grid;gap:0}
#app .bx-col li{position:relative;display:flex;flex-direction:column;gap:4px;padding:14px 0;border-top:1px solid rgba(255,255,255,.08)}
#app .bx-col li:last-child{border-bottom:1px solid rgba(255,255,255,.08)}
#app .bx-col em{position:absolute;left:0;top:16px;font:700 10.5px/1 var(--en);font-style:normal;color:#fd4533}
#app .bx-in li{padding-left:28px}
#app .bx-col b{display:flex;align-items:center;gap:8px;font:800 clamp(16px,1.3vw,19px)/1.3 var(--kr);color:#fff}
#app .bx-col span{font:400 13.5px/1.55 var(--kr);color:rgba(255,255,255,.62);word-break:keep-all}
#app .bx-tag{padding:3px 8px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(253,69,51,.6);font:700 10.5px/1 var(--en);letter-spacing:.06em;color:#fd4533;text-decoration:none}
#app .bx-tag:hover{background:#fd4533;color:#fff}
/* 연결선: 왼쪽 항목 → 버스 → 분신, 분신 → 버스 → 오른쪽 항목 */
#app .bx-in li::after{content:"";position:absolute;right:-32px;top:50%;width:32px;height:1px;background:rgba(255,255,255,.28)}
#app .bx-in ol::after{content:"";position:absolute;right:-32px;top:calc(12.5% + 0px);bottom:12.5%;width:1px;background:rgba(255,255,255,.28)}
#app .bx-out li::before{content:"";position:absolute;left:-32px;top:50%;width:26px;height:1px;background:rgba(255,255,255,.28)}
#app .bx-out li::after{content:"";position:absolute;left:-8px;top:calc(50% - 4px);border:4px solid transparent;border-left:6px solid rgba(255,255,255,.5);border-right:0}
#app .bx-out ul::before{content:"";position:absolute;left:-32px;top:16.6%;bottom:16.6%;width:1px;background:rgba(255,255,255,.28)}
#app .bx-out li{padding-left:6px}
#app .bx-core{position:relative;display:flex;flex-direction:column;gap:12px}
#app .bx-core::before{content:"";position:absolute;left:-32px;top:44px;width:26px;height:1px;background:rgba(255,255,255,.28)}
#app .bx-core::after{content:"";position:absolute;right:-32px;top:44px;width:32px;height:1px;background:rgba(255,255,255,.28)}
#app .bx-main{margin:0;display:grid;place-items:center;height:88px;border-radius:14px;background:linear-gradient(150deg,#fd4533,#c9301f);font:800 clamp(22px,1.9vw,28px)/1 var(--kr);letter-spacing:-.04em;color:#fff;box-shadow:0 24px 50px -30px rgba(253,69,51,.7)}
#app .bx-how{margin:0;padding:18px 20px;border-radius:14px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);font:400 13.5px/1.6 var(--kr);color:rgba(255,255,255,.66)}
#app .bx-how b{display:block;margin-bottom:6px;font:800 15px/1.2 var(--kr);color:#fff}
#app .bx-rule{margin-top:clamp(40px,4.4vw,60px)}
#app .bx-rule ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.14)}
#app .bx-rule li{display:flex;flex-direction:column;gap:6px;padding:18px 24px 0 0}
#app .bx-rule li+li{padding-left:24px;border-left:1px solid rgba(255,255,255,.1)}
#app .bx-rule b{font:800 17px/1.2 var(--kr);color:#fff}
#app .bx-rule span{font:400 14px/1.6 var(--kr);color:rgba(255,255,255,.66)}
@media (max-width:1000px){#app .bx{grid-template-columns:1fr;gap:28px}#app .bx>*{grid-column:1 !important}#app .bx-in li::after,#app .bx-in ol::after,#app .bx-out li::before,#app .bx-out li::after,#app .bx-out ul::before,#app .bx-core::before,#app .bx-core::after{display:none}#app .bx-rule ul{grid-template-columns:1fr}#app .bx-rule li+li{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.1)}#app .bx-rule li{padding:14px 0}}
/* STUDIO 제작 방식: 달라지게 하는 방법 4 */
#app .stx-how{margin-top:clamp(28px,3vw,40px)}
#app .stx-hk{margin:0 0 12px;font:700 12.5px/1 var(--kr);color:rgba(255,255,255,.55)}
#app .stx-how ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.14)}
#app .stx-how li{display:flex;flex-direction:column;gap:8px;padding:18px 20px 0 0}
#app .stx-how li+li{padding-left:20px;border-left:1px solid rgba(255,255,255,.1)}
#app .stx-how em{font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:#fd4533}
#app .stx-how b{font:800 17px/1.3 var(--kr);color:#fff}
#app .stx-how span{font:400 13.5px/1.6 var(--kr);color:rgba(255,255,255,.62);word-break:keep-all}
@media (max-width:1000px){#app .stx-how ul{grid-template-columns:1fr 1fr}#app .stx-how li:nth-child(3){padding-left:0;border-left:0}#app .stx-how li{padding-bottom:16px}}
@media (max-width:560px){#app .stx-how ul{grid-template-columns:1fr}#app .stx-how li+li{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.1)}}
/* ===== 서비스 AS IS → TO BE 고도화: 번호 · 읽히는 AS IS · 바뀌는 줄 강조 ===== */
#app .pv3-cmp .transform-rows{counter-reset:cmp}
#app .pv3-cmp .transform-row{counter-increment:cmp;position:relative;padding-left:56px !important;transition:background-color .5s ease}
#app .pv3-cmp .transform-row::before{content:counter(cmp,decimal-leading-zero);position:absolute;left:0;top:50%;transform:translateY(-50%);font:700 13px/1 var(--en);letter-spacing:.08em;color:rgba(255,255,255,.3);transition:color .5s ease}
#app .pv3-cmp .transform-row::after{content:"";position:absolute;left:-1px;top:16%;bottom:16%;width:2px;background:#fd4533;transform:scaleY(0);transition:transform .6s cubic-bezier(.22,1,.36,1)}
#app .pv3-cmp .transform-row.is-transformed{background:linear-gradient(90deg,rgba(253,69,51,.07),transparent 60%)}
#app .pv3-cmp .transform-row.is-transformed::before{color:#fd4533}
#app .pv3-cmp .transform-row.is-transformed::after{transform:scaleY(1)}
#app .pv3-cmp .from-copy{font:500 clamp(15px,1.15vw,17px)/1.55 var(--kr) !important;color:rgba(255,255,255,.62) !important}
#app .pv3-cmp .transform-row.is-transformed .from-copy{color:rgba(255,255,255,.38) !important;text-decoration:line-through;text-decoration-color:rgba(253,69,51,.55);text-decoration-thickness:1px}
#app .pv3-cmp .transform-labels{padding-left:56px}
@media (max-width:900px){#app .pv3-cmp .transform-row,#app .pv3-cmp .transform-labels{padding-left:40px !important}}
/* ===== GROWTH Beyond the ad v3: 가운데 정렬 · 흐르는 입자 · 단계 수치 · 이탈률 · 자동 순환 ===== */
#app .gfx-srcl{width:16.4% !important}
#app .gfx-fl path{stroke-dasharray:0 24 !important;stroke-width:3.2 !important;stroke-linecap:round;opacity:.55 !important}
#app .gfx-dfl path{stroke-dasharray:0 18 !important;stroke-width:3 !important;stroke-linecap:round}
#app .gfx-val{font:700 13px var(--en);fill:rgba(255,255,255,.55)}
#app .gfx-db{gap:5px !important}
#app .gfx-pct{font:800 15px/1 var(--en);font-style:normal;color:rgba(255,255,255,.45);transition:color .3s ease}
#app .gfx-db.on .gfx-pct{color:#fd4533}
#app .gfx-pb{display:block;width:64px;height:2px;margin-top:4px;background:rgba(255,255,255,.1);position:relative;overflow:hidden;border-radius:2px}
#app .gfx-pb::after{content:"";position:absolute;inset:0;background:#fd4533;transform:scaleX(0);transform-origin:0 50%}
#app .gfx-db.on .gfx-pb::after{animation:gfxPb 4.5s linear forwards}
#app .gfx.is-user .gfx-db.on .gfx-pb::after{animation:none;transform:scaleX(1)}
@keyframes gfxPb{to{transform:scaleX(1)}}
#app .gfx-drop{transition:fill .4s ease,stroke .4s ease,opacity .4s ease}
#app .gfx-drop:hover{stroke:rgba(253,69,51,.9) !important}
@media (prefers-reduced-motion:reduce){#app .gfx-db.on .gfx-pb::after{animation:none;transform:scaleX(1)}}
/* ===== GROWTH BRIXON AI OS ===== */
#app .gos{display:flex;flex-direction:column}
#app .gos-mon{align-self:center;width:min(100%,1080px) !important;max-width:none !important}
#app .gos-mon .dvx-scr{aspect-ratio:16/10;background:#0e0e10 !important;border-radius:18px !important}
#app .gos-fit{position:relative;width:100%;height:100%;overflow:hidden;background:#f4f4f6}
#app .gos-fit iframe{position:absolute;left:0;top:0;width:1440px;height:900px;border:0;transform-origin:0 0;opacity:0;transition:opacity .6s ease}
#app .gos-fit.is-ready iframe{opacity:1}
#app .gos-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:radial-gradient(closest-side,#1d1d21,#0e0e10)}
#app .gos-ph b{font:800 28px/1 var(--en);letter-spacing:-.03em;color:#fff}
#app .gos-ph span{font:500 13px/1 var(--kr);color:rgba(255,255,255,.5)}
#app .gos-fit.is-ready .gos-ph{opacity:0;pointer-events:none;transition:opacity .6s ease}
#app .gos-acts{display:flex;justify-content:center;align-items:center;gap:22px;margin-top:22px}
#app .gos-full{font:600 14px/1 var(--kr);color:rgba(255,255,255,.75);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:3px}
#app .gos-full:hover{color:#fd4533;border-color:#fd4533}
#app .gos-k{margin:0 0 12px;font:700 12.5px/1 var(--kr);color:rgba(255,255,255,.55)}
#app .gos-map{display:grid;grid-template-columns:minmax(0,1.1fr) auto minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:center;margin-top:clamp(48px,5vw,72px)}
#app .gos-map ul{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.14)}
#app .gos-map li{display:grid;grid-template-columns:120px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
#app .gos-map b{font:800 16px/1.4 var(--kr);color:#fff}
#app .gos-map span{font:400 13.5px/1.6 var(--kr);color:rgba(255,255,255,.62);word-break:keep-all}
#app .gos-dst li{grid-template-columns:96px 1fr}
#app .gos-dst li.is-key b{color:#fd4533}
#app .gos-core{position:relative;display:grid;place-items:center;width:150px;height:150px;border-radius:50%;background:radial-gradient(closest-side,rgba(253,69,51,.35),rgba(253,69,51,.08) 70%,transparent);box-shadow:inset 0 0 0 1.5px #fd4533}
#app .gos-core span{font:800 18px/1 var(--en);letter-spacing:-.02em;color:#fff}
#app .gos-core::before,#app .gos-core::after{content:"→";position:absolute;top:50%;transform:translateY(-50%);font:400 20px/1 var(--en);color:rgba(255,255,255,.5)}
#app .gos-core::before{left:-30px}#app .gos-core::after{right:-30px;color:#fd4533}
#app .gos-k2{margin-top:clamp(44px,4.6vw,64px)}
#app .gos-do{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;border-top:1px solid rgba(255,255,255,.14)}
#app .gos-do li{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px 14px 18px 0}
#app .gos-do li+li{padding-left:14px;border-left:1px solid rgba(255,255,255,.08)}
#app .gos-do em{font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:rgba(255,255,255,.4)}
#app .gos-do b{font:800 15px/1.35 var(--kr);color:#fff;word-break:keep-all}
#app .gos-do small{font:500 12px/1.5 var(--kr);color:rgba(255,255,255,.75)}
#app .gos-do li.is-key{background:linear-gradient(180deg,rgba(253,69,51,.18),transparent 90%);box-shadow:inset 0 2px 0 #fd4533}
#app .gos-do li.is-key em,#app .gos-do li.is-key b{color:#fd4533}
#app .gos-loop{margin:0;display:flex;justify-content:flex-end}
#app .gos-loop span{display:inline-block;margin-right:calc(100% / 7 * .5);padding:10px 0 0;font:600 12.5px/1 var(--kr);color:#fd4533}
#app .gos-x{display:flex;gap:16px;align-items:baseline;margin:22px 0 0;padding:14px 18px;border-left:2px solid #fd4533;background:rgba(255,255,255,.03);font:400 14px/1.6 var(--kr);color:rgba(255,255,255,.75)}
#app .gos-x b{flex:none;font-weight:800;color:#fff}
#app .gos-foot{margin:16px 0 0;font:500 12.5px/1.6 var(--kr);color:rgba(255,255,255,.42)}
@media (max-width:1000px){#app .gos-map{grid-template-columns:1fr}#app .gos-core{margin:0 auto;width:120px;height:120px}#app .gos-core::before,#app .gos-core::after{display:none}#app .gos-do{grid-template-columns:repeat(2,minmax(0,1fr))}#app .gos-do li:nth-child(odd){padding-left:0;border-left:0}#app .gos-do li{border-top:1px solid rgba(255,255,255,.08)}#app .gos-loop{justify-content:flex-start}#app .gos-loop span{margin:0}#app .gos-x{flex-direction:column;gap:4px}#app .gos-map li,#app .gos-dst li{grid-template-columns:1fr;gap:4px}}
#app .pv2 #grow-os .hl{display:block !important;text-align:left !important;margin:0 0 clamp(52px,5.4vw,88px) !important;max-width:820px}#app .pv2 #grow-os .hl h2{margin:0 !important;text-align:left !important;font:800 clamp(34px,3.7vw,56px)/1.04 var(--en) !important;letter-spacing:-.045em !important}#app .pv2 #grow-os .hl .kc{margin:clamp(16px,1.6vw,22px) 0 0 !important;text-align:left !important}#app .pv2 #grow-os .hl .kc b{font:700 clamp(21px,1.75vw,27px)/1.4 var(--kr) !important}#app .pv2 #grow-os .hl .kc p{margin:8px 0 0 !important;max-width:720px;text-align:left !important;font:400 clamp(15px,1.1vw,17px)/1.65 var(--kr) !important}#app .pv2 #grow-os .section-index{text-align:left !important;justify-content:flex-start !important;margin-left:0 !important;display:flex !important;margin-bottom:clamp(14px,1.4vw,20px) !important}
@media (max-width:700px){#app .gos-mon .dvx-scr{aspect-ratio:3/4 !important}}
/* ===== GROWTH Every morning v2 ===== */
#app .gd-flow li.is-key{background:linear-gradient(180deg,rgba(253,69,51,.2),transparent 90%) !important;box-shadow:inset 0 2px 0 #fd4533 !important;border-radius:0 !important}
#app .gd-flow li.is-key b,#app .gd-flow li.is-key .gd-n{color:#fd4533 !important}
#app .gd-flow li.is-key{padding-left:14px !important;padding-right:14px !important}
#app .gd-loop{margin:10px 0 0;display:flex;justify-content:flex-end}
#app .gd-loop span{font:600 12.5px/1 var(--kr);color:#fd4533}
#app .ga2{display:grid !important;grid-template-columns:minmax(280px,320px) minmax(0,1fr) !important;gap:clamp(32px,5vw,80px) !important;align-items:start !important;margin-top:clamp(44px,4.6vw,64px)}
#app .ga-k{display:flex;align-items:center;gap:10px;margin:0 0 14px;font:700 12.5px/1 var(--kr);color:rgba(255,255,255,.55)}
#app .ga-k em{font-style:normal;padding:4px 8px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);font-size:11px;color:rgba(255,255,255,.6)}
#app .ga-ph .dvx-ph{width:100% !important}
#app .ga-cd .ga-v{margin:0 0 4px;font:500 12px/1.4 var(--kr);color:#333 !important}
#app .ga-cd .ga-v b{color:#111 !important;font-weight:800}
#app .ga-cd .ga-e{margin:0 0 8px;font:600 11.5px/1.4 var(--kr);color:#e0301f !important}
#app .ga-bt{display:grid;grid-template-columns:1fr 1fr;gap:6px}
#app .ga-bt span{display:grid;place-items:center;height:28px;border-radius:8px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18);font:700 12px/1 var(--kr);color:#111 !important}
#app .ga-bt .is-ok{background:#fd4533;box-shadow:none;color:#fff !important}
#app .ga-ph .msn-av{font-size:10.5px !important}
#app .ga-pr{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#app .ga-pr li{display:flex;align-items:center;gap:10px;padding:14px 16px;border-radius:12px;background:rgba(253,69,51,.08);box-shadow:inset 0 0 0 1px rgba(253,69,51,.35)}
#app .ga-pr i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fd4533;font:700 14px/1 var(--en);font-style:normal;color:#fff}
#app .ga-pr b{font:800 16px/1 var(--kr);color:#fff}
#app .ga-lanes{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.14)}
#app .ga-lanes li{display:grid;grid-template-columns:200px minmax(0,1fr);align-items:center;gap:18px;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.08)}
#app .ga-lh{display:flex;align-items:center;gap:12px}
#app .ga-ic{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.06);font-size:16px}
#app .ga-lh b{font:800 16px/1.3 var(--kr);color:#fff}
#app .ga-l0 .ga-lh b{color:#fd4533}
#app .ga-chips{display:flex;flex-wrap:wrap;gap:6px}
#app .ga-chips span{padding:7px 12px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);font:500 13px/1 var(--kr);color:rgba(255,255,255,.82)}
#app .ga-l0 .ga-chips span{box-shadow:inset 0 0 0 1px rgba(253,69,51,.45)}
#app .ga-l2 .ga-chips span{color:rgba(255,255,255,.5);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);background:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 4px,transparent 4px 8px)}
#app .gk2{margin-top:clamp(48px,5vw,72px)}
#app .gk2 .gk-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
#app .gk2 .gk-c{display:flex !important;flex-direction:column;gap:10px;padding:18px 18px 16px !important;border-radius:14px !important;border:0 !important;background:#18181b !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1) !important}
#app .gk2 .gk-c small{font:700 14px/1.3 var(--kr);color:#fff}
#app .gk-sp{width:100%;height:40px}
#app .gk-sp path{fill:none;stroke:#fd4533;stroke-width:2;stroke-linecap:round}
#app .gk-asm .gk-sp path{stroke:rgba(255,255,255,.6);stroke-dasharray:4 5}
#app .gk-none .gk-sp rect{fill:none;stroke:rgba(255,255,255,.2);stroke-dasharray:3 4}
#app .gk2 .gk-c b{margin:0 !important;font:800 24px/1 var(--en);color:rgba(255,255,255,.7)}
#app .gk-lg{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 24px}
#app .gk-lg li{display:flex;align-items:center;gap:8px;font:500 13px/1.4 var(--kr);color:rgba(255,255,255,.62)}
#app .gk2 .gk-note{margin:10px 0 0;font:500 12.5px/1.5 var(--kr);color:rgba(255,255,255,.42)}
#app .ga-card,#app .ga-rules{display:none}
@media (max-width:1000px){#app .ga2{grid-template-columns:1fr !important}#app .ga-ph{max-width:320px;margin:0 auto}#app .ga-lanes li{grid-template-columns:1fr;gap:10px}#app .gk2 .gk-grid{grid-template-columns:1fr 1fr}#app .ga-pr{grid-template-columns:1fr}#app .gd-loop{justify-content:flex-start}}
#app .ga-ph .dvx-ph{aspect-ratio:9/15.5 !important}
#app .ga-ic svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#app .ga-l0 .ga-ic{background:rgba(253,69,51,.16)}#app .ga-l0 .ga-ic svg{stroke:#fd4533}
#app .ga2{align-items:center !important}
/* ===== DESK 첫 장면: 회사소개서 흐름(사업 이해 → 아이디어 → AX 기획 → 두 갈래 구현 → 실현)을 한 줄 도식으로 ===== */
#app .dr{display:none !important}
#app .dkf{margin-top:clamp(48px,5vw,72px)}
#app .dkf-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 56px minmax(0,1.5fr) 56px minmax(0,.95fr);align-items:stretch;min-height:240px}
#app .dkf-st{position:relative;display:grid;grid-template-rows:1fr 16px 1fr;align-items:center;padding-right:18px}
#app .dkf-st::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.35),rgba(253,69,51,.6))}
#app .dkf-st em{position:absolute;left:0;top:calc(50% - 64px);font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:#fd4533}
#app .dkf-st b{align-self:end;padding-bottom:16px;font:800 clamp(18px,1.5vw,22px)/1.2 var(--kr);letter-spacing:-.03em;color:#fff}
#app .dkf-dot{position:relative;z-index:1;width:14px;height:14px;border-radius:50%;background:#121214;box-shadow:inset 0 0 0 2px #fd4533,0 0 0 5px rgba(253,69,51,.12)}
#app .dkf-st span{align-self:start;padding-top:16px;font:400 13.5px/1.6 var(--kr);color:rgba(255,255,255,.62);word-break:keep-all}
#app .dkf-fork,#app .dkf-merge{width:100%;height:100%;overflow:visible}
#app .dkf-fork path,#app .dkf-merge path{fill:none;stroke:rgba(253,69,51,.6);stroke-width:1.2;vector-effect:non-scaling-stroke}
#app .dkf-lanes{display:grid;grid-template-rows:1fr 1fr;gap:0}
#app .dkf-ln{position:relative;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:10px 18px;border-left:2px solid rgba(253,69,51,.6)}
#app .dkf-ln::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(253,69,51,.25);z-index:-1}
#app .dkf-ln small{font:700 11px/1 var(--kr);color:#fd4533}
#app .dkf-ln b{font:800 clamp(17px,1.35vw,20px)/1.25 var(--kr);color:#fff;background:#1b1b1e;width:max-content;padding-right:10px}
#app .dkf-ln span{font:400 13px/1.5 var(--kr);color:rgba(255,255,255,.62);background:#1b1b1e;width:max-content;padding-right:10px}
#app .dkf-end{padding-left:14px;padding-right:0}
#app .dkf-end::before{left:0;right:auto;width:14px}
#app .dkf-end em{left:14px}
#app .dkf-end .dkf-dot{width:20px;height:20px;background:#fd4533;box-shadow:0 0 0 6px rgba(253,69,51,.18),0 0 24px rgba(253,69,51,.55)}
#app .dkf-end b{color:#fd4533}
#app .dkf-band{display:grid;grid-template-columns:calc((100% - 112px) * 3 / 6.45);margin-top:10px}
#app .dkf-band i{display:block;height:10px;border:1px solid rgba(255,255,255,.3);border-top:0;border-radius:0 0 6px 6px}
#app .dkf-band p{margin:12px 0 0;font:400 13.5px/1.6 var(--kr);color:rgba(255,255,255,.62)}
#app .dkf-band small{display:inline-block;margin-right:10px;padding:4px 9px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);font:700 11px/1 var(--kr);color:rgba(255,255,255,.75)}
#app .dkf-band b{margin-right:10px;font:800 15px/1.4 var(--kr);color:#fff}
#app .dkf-one{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 24px;margin:clamp(40px,4.4vw,60px) 0 0;padding-top:clamp(24px,2.6vw,32px);border-top:1px solid rgba(255,255,255,.14)}
#app .dkf-one b{font:800 clamp(26px,2.6vw,38px)/1.2 var(--kr);letter-spacing:-.045em;color:#fff}
#app .dkf-one mark{background:none;color:#fd4533;box-shadow:inset 0 -.18em 0 rgba(253,69,51,.25)}
#app .dkf-one span{font:400 clamp(15px,1.15vw,17px)/1.6 var(--kr);color:rgba(255,255,255,.7)}
@media (max-width:1100px){
 #app .dkf-track{grid-template-columns:1fr;min-height:0;gap:0}
 #app .dkf-fork,#app .dkf-merge{display:none}
 #app .dkf-st{grid-template-rows:auto;grid-template-columns:20px 1fr;column-gap:14px;padding:14px 0;border-left:1px solid rgba(253,69,51,.4);padding-left:18px;margin-left:7px}
 #app .dkf-st::before{display:none}
 #app .dkf-st em{position:static;grid-column:2}
 #app .dkf-dot{position:absolute;left:-8px;top:18px}
 #app .dkf-st b,#app .dkf-st span{grid-column:2;padding:0}
 #app .dkf-lanes{grid-template-rows:auto;gap:10px;margin:8px 0 8px 25px}
 #app .dkf-ln::after{display:none}
 #app .dkf-ln b,#app .dkf-ln span{width:auto}
 #app .dkf-end{padding-left:18px}
 #app .dkf-band{grid-template-columns:1fr}
}
#app .dkf-ln::after{display:none !important}
#app .dkf-ln b,#app .dkf-ln span{background:none !important;padding-right:0 !important}
#app .dkf-one mark{background:none !important;-webkit-text-fill-color:#fd4533 !important;color:#fd4533 !important;padding:0 !important;box-shadow:inset 0 -.16em 0 rgba(253,69,51,.3) !important}
#app .dkf-band p span{display:block;margin-top:6px}
#app .dkf-one .dkf-em{font-style:normal;color:#fd4533}
/* ===== DESK Trust by design v2: 회사소개서 — 발송 절차 · 자율↔사람 스펙트럼 · 정하는 것 ===== */
#app .tv-k{margin:0 0 14px;font:700 12.5px/1 var(--kr);color:rgba(255,255,255,.55)}
#app .tv-k2{margin-top:clamp(40px,4.4vw,60px)}
#app .tv-flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:relative}
#app .tv-flow::before{content:"";position:absolute;left:22px;right:22px;top:22px;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.3),#fd4533 70%,rgba(255,255,255,.3))}
#app .tv-flow li{position:relative;display:flex;flex-direction:column;gap:6px;padding-right:16px}
#app .tv-ic{position:relative;z-index:1;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#18181b;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.3);margin-bottom:8px}
#app .tv-ic svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#app .tv-flow em{font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:rgba(255,255,255,.45)}
#app .tv-flow b{font:800 17px/1.25 var(--kr);color:#fff}
#app .tv-flow small{font:400 13px/1.55 var(--kr);color:rgba(255,255,255,.62);word-break:keep-all}
#app .tv-flow li.is-human .tv-ic{box-shadow:inset 0 0 0 1.5px #fff;background:#2a2a2e}
#app .tv-flow li.is-key .tv-ic{background:#fd4533;box-shadow:0 0 0 6px rgba(253,69,51,.16),0 0 22px rgba(253,69,51,.5)}
#app .tv-flow li.is-key em,#app .tv-flow li.is-key b{color:#fd4533}
#app .tv-axis{display:flex;align-items:center;gap:12px;margin-bottom:10px;font:600 11.5px/1 var(--kr);color:rgba(255,255,255,.5)}
#app .tv-axis i{flex:1;height:2px;border-radius:2px;background:linear-gradient(90deg,rgba(255,255,255,.25),#fd4533,#fff)}
#app .tv-sp ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
#app .tv-sp li{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;border-radius:12px}
#app .tv-now{background:rgba(255,255,255,.05)}
#app .tv-ask{background:rgba(253,69,51,.12);box-shadow:inset 0 0 0 1px rgba(253,69,51,.45)}
#app .tv-human{background:#f1f1f3}
#app .tv-sp b{font:800 18px/1.2 var(--kr);color:#fff}
#app .tv-sp span{font:500 14px/1.6 var(--kr);color:rgba(255,255,255,.8)}
#app .tv-sp small{margin-top:auto;font:600 12.5px/1.4 var(--kr);color:rgba(255,255,255,.5)}
#app .tv-ask b,#app .tv-ask small{color:#fd4533}
#app .tv-human b{color:#111}#app .tv-human span{color:#333}#app .tv-human small{color:#666}
#app .tv-ru{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.14)}
#app .tv-ru li{display:flex;flex-direction:column;gap:8px;padding:18px 24px 0 0}
#app .tv-ru li+li{padding-left:24px;border-left:1px solid rgba(255,255,255,.1)}
#app .tv-ru b{font:800 17px/1.25 var(--kr);color:#fff}
#app .tv-ru span{font:400 14px/1.6 var(--kr);color:rgba(255,255,255,.66);word-break:keep-all}
#app .tv-foot{margin:22px 0 0;font:500 12.5px/1.5 var(--kr);color:rgba(255,255,255,.42)}
#app #desk-trust .dt-cols,#app #desk-trust .dt-flow,#app #desk-trust .dt-note{display:none !important}
@media (max-width:1000px){#app .tv-flow{grid-template-columns:1fr;gap:14px}#app .tv-flow::before{left:22px;right:auto;top:22px;bottom:22px;width:1px;height:auto}#app .tv-flow li{display:grid;grid-template-columns:44px 1fr;column-gap:14px;row-gap:4px}#app .tv-ic{grid-row:span 3;margin:0}#app .tv-sp ol{grid-template-columns:1fr}#app .tv-ru{grid-template-columns:1fr}#app .tv-ru li+li{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.1)}#app .tv-ru li{padding:14px 0}}
#app .tv-sp .tv-human b{color:#111 !important}#app .tv-sp .tv-human span{color:#333 !important}#app .tv-sp .tv-human small{color:#666 !important}
/* ===== DESK AS IS → TO BE: 회사소개서 에이전틱 커머스(MCP) — 고객 AI 대화 + 툴 호출 레일 + 전에는/MCP로 연결하면 ===== */
#app .mcx{display:grid;grid-template-columns:minmax(260px,300px) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center;margin:clamp(28px,3vw,40px) 0 clamp(44px,4.6vw,64px)}
#app .mcx-k{display:flex;align-items:center;gap:10px;margin:0 0 14px;font:700 12.5px/1 var(--kr);color:rgba(255,255,255,.55)}
#app .mcx-k em{font-style:normal;padding:4px 8px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);font-size:11px}
#app .mcx-ph .dvx-ph{width:100% !important;aspect-ratio:9/17 !important}
#app .mcx-chat{display:flex;flex-direction:column;gap:8px}
#app .mcx-u{align-self:flex-end;max-width:80%;padding:8px 11px;border-radius:14px 14px 4px 14px;background:#111;font:600 12px/1.45 var(--kr);color:#fff !important}
#app .mcx-a{align-self:flex-start;max-width:88%;padding:8px 11px;border-radius:14px 14px 14px 4px;background:#f1f1f4;font:500 12px/1.5 var(--kr);color:#111 !important}
#app .mcx-a small{display:flex;align-items:center;gap:4px;margin-bottom:3px;font:700 10px/1.2 var(--kr);color:#e0301f !important}
#app .mcx-a small::before{content:"⚙";font-size:10px}
#app .mcx-rail{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.14)}
#app .mcx-rail li{display:grid;grid-template-columns:40px 90px minmax(0,1fr) auto;align-items:center;gap:14px;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.08)}
#app .mcx-rail em{font:700 12px/1 var(--en);font-style:normal;letter-spacing:.1em;color:rgba(255,255,255,.4)}
#app .mcx-rail b{font:800 clamp(18px,1.5vw,22px)/1 var(--kr);color:#fff}
#app .mcx-rail p{margin:0;font:500 15px/1.4 var(--kr);color:rgba(255,255,255,.75)}
#app .mcx-tool{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:rgba(253,69,51,.1);box-shadow:inset 0 0 0 1px rgba(253,69,51,.45);font:600 12.5px/1 var(--kr);color:#fd4533;white-space:nowrap}
#app .mcx-tool i{font-style:normal}
#app .pv3-cmp .cmp-l{position:absolute;left:56px;top:14px;font:700 11.5px/1 var(--kr);color:#fd4533}
#app .pv3-cmp .transform-row:has(.cmp-l){padding-top:34px !important}
@media (max-width:1000px){#app .mcx{grid-template-columns:1fr}#app .mcx-ph{max-width:300px;margin:0 auto}#app .mcx-rail li{grid-template-columns:32px 1fr;row-gap:6px}#app .mcx-rail p,#app .mcx-tool{grid-column:2}#app .mcx-tool{justify-self:start}#app .pv3-cmp .cmp-l{left:40px}}
/* ===== 서비스 Sound Familiar v4: 인덱스 서비스 카드 결 — 상자 없이 세로 줄로만 나눈 3단 ===== */
#app .pvc{list-style:none;margin:clamp(20px,2.4vw,36px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14)}
#app .pvc-c{position:relative;display:flex;flex-direction:column;padding:28px clamp(20px,2.4vw,36px) 32px}
#app .pvc-c+.pvc-c{border-left:1px solid rgba(255,255,255,.12)}
#app .pvc-c:first-child{padding-left:0}#app .pvc-c:last-child{padding-right:0}
#app .pvc-c::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:#fd4533;transform:scaleX(0);transform-origin:0 50%;transition:transform .6s cubic-bezier(.22,1,.36,1)}
#app .pvc-c:hover::before{transform:scaleX(1)}
#app .pvc-top{display:flex;align-items:baseline;gap:12px;font:700 13px/1 var(--en);letter-spacing:.14em;color:rgba(255,255,255,.5)}
#app .pvc-top em{font-style:normal;font-size:15px;color:#fff;letter-spacing:.04em}
#app .pvc-viz{position:relative !important;top:auto !important;margin:18px 0 6px !important}
#app .pvc-viz canvas{width:100% !important;aspect-ratio:4/2.6 !important;background:transparent !important;box-shadow:none !important;border-radius:0 !important}
#app .pvc-t{display:block;font:800 clamp(22px,1.9vw,30px)/1.25 var(--kr);letter-spacing:-.045em;color:#fff;word-break:keep-all;transition:color .35s ease}
#app .pvc-c:hover .pvc-t{color:#fd4533}
#app .pvc-q{margin:16px 0 0;font:600 clamp(15px,1.15vw,17px)/1.6 var(--kr);color:rgba(255,255,255,.82);word-break:keep-all}
#app .pvc-q b{color:#fff}
#app .pvc-q small{display:inline-flex;margin:0 0 10px;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.08);font:700 11px/1 var(--kr);color:rgba(255,255,255,.6);display:table}
#app .pvc-cs{list-style:none;margin:auto 0 0;padding:16px 0 0;border-top:1px solid rgba(255,255,255,.1);display:grid;gap:10px}
#app .pvc-q{margin-bottom:22px}
#app .pvc-cs li{display:flex;flex-direction:column;gap:3px}
#app .pvc-cs span{font:500 13px/1.45 var(--kr);color:rgba(255,255,255,.55)}
#app .pvc-cs b{font:700 14px/1.4 var(--kr);color:#fd4533}
#app .pv-ys{display:none !important}
@media (max-width:900px){#app .pvc{grid-template-columns:1fr}#app .pvc-c,#app .pvc-c:first-child,#app .pvc-c:last-child{padding:24px 0}#app .pvc-c+.pvc-c{border-left:0;border-top:1px solid rgba(255,255,255,.12)}#app .pvc-viz{max-width:360px}}
/* pvc: 행 정렬(subgrid) — 제목 · 고민 · 사례 줄을 칸끼리 맞춤 */
@media (min-width:901px){#app .pvc{grid-template-rows:auto auto auto auto 1fr}#app .pvc-c{display:grid;grid-row:span 5;grid-template-rows:subgrid;align-content:start}#app .pvc-cs{margin:0;align-self:start}#app .pvc-q{margin-bottom:26px}}
#app .pvc-viz{margin:14px 0 10px !important}
#app .pvc-viz{order:0 !important}#app .pvc-top{order:0 !important}
/* What It Covers: 산출물 레일 — 박스 · 알약 띠 대신 진행 줄 하나에 단계 마디와 산출물을 매닮 */
#app .sx-rail{position:relative;list-style:none;margin:clamp(30px,3.2vw,48px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px);--rp:1}
#app .sx-cap[data-st="1"] .sx-rail{--rp:0}#app .sx-cap[data-st="2"] .sx-rail{--rp:.5}
#app .sx-rp{position:absolute;left:calc(100%/6);right:calc(100%/6);top:38px;height:1px;background:rgba(255,255,255,.14);pointer-events:none}
#app .sx-rp i{position:absolute;inset:0;background:linear-gradient(90deg,rgba(253,69,51,.2),#fd4533);transform-origin:0 50%;transform:scaleX(var(--rp));transition:transform 1.1s cubic-bezier(.22,1,.36,1)}
#app .sx-rail li{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center}
#app .sx-rk{display:block;height:14px;font:700 11.5px/14px var(--en);letter-spacing:.18em;color:rgba(255,255,255,.42);transition:color .5s ease}
#app .sx-rk b{color:#fd4533;margin-right:.7em;letter-spacing:.06em}
#app .sx-rn{position:relative;z-index:1;display:block;width:11px;height:11px;margin:19px 0 0;border-radius:50%;background:#0d0d0f;box-shadow:0 0 0 1px rgba(255,255,255,.34);transition:background .5s ease,box-shadow .5s ease}
#app .sx-rn::after{content:"";position:absolute;left:50%;top:calc(100% + 6px);width:1px;height:22px;background:linear-gradient(rgba(255,255,255,.22),transparent);transition:background .5s ease}
#app .sx-rail p{margin:36px 0 0;max-width:24ch;font:600 clamp(15px,1.1vw,16.5px)/1.55 var(--kr);letter-spacing:-.02em;color:rgba(255,255,255,.5);word-break:keep-all;text-wrap:balance;transition:color .5s ease}
#app .sx-cap[data-st="2"] .sx-rail li[data-s="1"] .sx-rn,#app .sx-cap:is([data-st="3"],[data-st="0"]) .sx-rail li:is([data-s="1"],[data-s="2"]) .sx-rn{box-shadow:0 0 0 1px #fd4533}
#app .sx-cap[data-st="2"] .sx-rail li[data-s="1"] p,#app .sx-cap:is([data-st="3"],[data-st="0"]) .sx-rail li:is([data-s="1"],[data-s="2"]) p{color:rgba(255,255,255,.72)}
#app .sx-cap[data-st="1"] .sx-rail li[data-s="1"] .sx-rn,#app .sx-cap[data-st="2"] .sx-rail li[data-s="2"] .sx-rn,#app .sx-cap:is([data-st="3"],[data-st="0"]) .sx-rail li[data-s="3"] .sx-rn{background:#fd4533;box-shadow:0 0 0 1px #fd4533,0 0 12px rgba(253,69,51,.32)}
#app .sx-cap[data-st="1"] .sx-rail li[data-s="1"] :is(.sx-rk,p),#app .sx-cap[data-st="2"] .sx-rail li[data-s="2"] :is(.sx-rk,p),#app .sx-cap:is([data-st="3"],[data-st="0"]) .sx-rail li[data-s="3"] :is(.sx-rk,p){color:#fff}
#app .sx-cap[data-st="1"] .sx-rail li[data-s="1"] .sx-rn::after,#app .sx-cap[data-st="2"] .sx-rail li[data-s="2"] .sx-rn::after,#app .sx-cap:is([data-st="3"],[data-st="0"]) .sx-rail li[data-s="3"] .sx-rn::after{background:linear-gradient(rgba(253,69,51,.6),transparent)}
@media (max-width:900px){#app .sx-rail{grid-template-columns:1fr;gap:26px;padding-left:2px}#app .sx-rp{left:7px;right:auto;top:6px;bottom:6px;width:1px;height:auto}#app .sx-rp i{transform-origin:50% 0;transform:scaleY(var(--rp))}#app .sx-rail li{display:grid;grid-template-columns:auto 1fr;column-gap:16px;row-gap:6px;align-items:center;text-align:left;padding-left:0}#app .sx-rn{grid-row:1;grid-column:1;margin:0 0 0 1px}#app .sx-rn::after{display:none}#app .sx-rk{grid-row:1;grid-column:2}#app .sx-rail p{grid-row:2;grid-column:2;margin:0;max-width:none}}
@media (prefers-reduced-motion:reduce){#app .sx-rp i{transition:none}}
/* 서비스 What We Do: 과한 여백 정리 — 제목 아래 0, 고정 화면은 위 정렬, 끝 빈 공간은 다음 섹션이 당겨 씀 */
@media (min-width:901px){
 #app .pv2 #pv-wd .wrap>.hl.rv,#app #pv-wd .wrap>.hl{margin-bottom:0 !important}
 #app #pv-wd .pv-hw .hw-stick{justify-content:flex-start !important;padding-top:clamp(40px,5.6vh,64px) !important}
 #app #pv-wd .pv-hw .hw-grid{margin-top:0 !important}
 #app #pv-wd .pv-hw{margin-bottom:min(0px,calc(400px - 100vh)) !important}
}
/* 서비스 견적 STUDIO · DESK: GROWTH 흰 가격표 결로 통일 */
#app .gp--est .gp-grid{border-top:0}
#app .gp--est .gp-card{padding-top:clamp(30px,3vw,44px)}
#app .gp--est .gp-top h3{font-family:var(--kr) !important;letter-spacing:-.04em}
#app .gp--est .gp-pr{display:flex;flex-direction:column;justify-content:flex-end;gap:8px;min-height:118px}
#app .gp--est .gp-p0{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px}
#app .gp--est .gp-p0 s{width:100%;font:600 14px/1 var(--kr)}
#app .gp--est .gp-ask{font:800 clamp(24px,2.1vw,30px)/1.2 var(--kr) !important;letter-spacing:-.04em;color:#111 !important}
#app .gp--est .gp-sub{display:block;font:600 13px/1.5 var(--kr);color:#fd4533}
@media (max-width:900px){#app .gp--est .gp-pr{min-height:0;padding-top:14px}}
/* 로드맵 v2: 곡선 하나 · 마디 4 · 단계 내용은 마디 아래 같은 열 — 박스 · 막대 · 존 라벨 없음 */
#app .rm-sec{height:auto !important;background:transparent !important}
#app .rm-sec .grow-in{position:relative !important;height:auto !important;min-height:0 !important;padding:0 !important}
#app .rm{position:relative;margin-top:clamp(52px,5.4vw,88px)}
#app .rm-svg{display:block;width:100%;height:clamp(170px,18vw,260px);overflow:visible}
#app .rm-track{fill:none;stroke:rgba(255,255,255,.12);stroke-width:1;vector-effect:non-scaling-stroke}
#app .rm-line{fill:none;stroke:url(#rmG);stroke-width:2;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;stroke-linecap:round}
#app .rm-area{fill:url(#rmA)}
#app .rm-stem{stroke:rgba(255,255,255,.14);stroke-width:1;stroke-dasharray:2 5;vector-effect:non-scaling-stroke}
#app .rm-dot{position:absolute;z-index:2;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;background:#111;box-shadow:0 0 0 1px rgba(255,255,255,.4);transition:background .5s ease,box-shadow .5s ease,transform .5s cubic-bezier(.22,1,.36,1)}
#app .rm-dot.on{background:#fd4533;box-shadow:0 0 0 1px #fd4533}
#app .rm-dot.cur,#app .rm-dot.peek{transform:scale(1.25);box-shadow:0 0 0 1px #fd4533,0 0 0 7px rgba(253,69,51,.14)}
#app .rm-head{position:absolute;z-index:3;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:#fff;box-shadow:0 0 10px rgba(253,69,51,.45);opacity:0;transition:opacity .4s ease}
#app .rm-head.on{opacity:1}
#app .rm-end{position:absolute;font:700 11.5px/1 var(--en);letter-spacing:.18em;color:rgba(255,255,255,.4)}
#app .rm-s{left:0;bottom:clamp(170px,18vw,260px);transform:translateY(-6px)}
#app .rm-e{right:0;top:-22px;color:#fd4533}
#app .rm-cols{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.14)}
#app .rm-c{position:relative;padding:24px clamp(14px,1.6vw,26px) 4px;opacity:.38;transition:opacity .6s ease;outline:none;cursor:default}
#app .rm-c+.rm-c{border-left:1px solid rgba(255,255,255,.08)}
#app .rm-c.on{opacity:.62}#app .rm-c.cur{opacity:1}
#app .rm.is-peek .rm-c{opacity:.32}#app .rm.is-peek .rm-c.peek{opacity:1}
#app .rm-c::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:#fd4533;transform:scaleX(0);transform-origin:0 50%;transition:transform .7s cubic-bezier(.22,1,.36,1)}
#app .rm-c.cur::before,#app .rm-c.peek::before{transform:scaleX(1)}
#app .rm-k{display:flex;align-items:baseline;gap:10px;margin:0 0 12px;font:700 12px/1 var(--en);letter-spacing:.12em;color:rgba(255,255,255,.45)}
#app .rm-k b{color:#fd4533;font-size:13px;letter-spacing:.04em}
#app .rm-c h4{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin:0;font:800 clamp(20px,1.7vw,26px)/1.2 var(--en);letter-spacing:-.03em;color:#fff}
#app .rm-c h4 em{font:700 14px/1 var(--kr);font-style:normal;color:#fd4533;letter-spacing:-.01em}
#app .rm-d{margin:10px 0 0;font:600 15px/1.5 var(--kr);color:rgba(255,255,255,.86);word-break:keep-all}
#app .rm-c ul{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:6px}
#app .rm-c ul li{position:relative;padding-left:12px;font:500 13.5px/1.5 var(--kr);color:rgba(255,255,255,.58);word-break:keep-all}
#app .rm-c ul li::before{content:"";position:absolute;left:0;top:.7em;width:4px;height:1px;background:rgba(255,255,255,.45)}
#app .rm-o{margin:16px 0 0;padding-top:12px;border-top:1px solid rgba(255,255,255,.08);font:700 13.5px/1.45 var(--kr);color:#fff;word-break:keep-all}
#app .rm-c:last-child .rm-o{color:#fd4533}
#app .rm-cap{margin-top:28px !important;font-size:12.5px;color:rgba(255,255,255,.4)}
@media (max-width:820px){#app .rm-svg,#app .rm-dot,#app .rm-head,#app .rm-end{display:none}#app .rm-cols{grid-template-columns:1fr;border-top:0;border-left:1px solid rgba(255,255,255,.14);margin-left:5px}#app .rm-c,#app .rm-c.on{opacity:1;padding:4px 0 26px 22px}#app .rm-c+.rm-c{border-left:0}#app .rm-c::before{left:-5.5px;right:auto;top:6px;width:9px;height:9px;border-radius:50%;transform:none;background:#111;box-shadow:0 0 0 1px #fd4533}#app .rm-c.cur::before{background:#fd4533}}
@media (prefers-reduced-motion:reduce){#app .rm-line{stroke-dashoffset:0}}
#app .rm-plot{position:relative}
#app .rm-s{left:16px;bottom:auto;top:calc(100% - 44px);transform:none}
#app .rm-e{right:0;top:-6px}
#app .rm-c{padding:22px clamp(16px,1.8vw,28px) 4px}
#app .rm-c:first-child{padding-left:0}
#app .rm-c+.rm-c{border-left:1px dashed rgba(255,255,255,.12)}
#app .rm-dot[data-i="0"]{margin-left:-1px}
@media (max-width:820px){#app .rm-c:first-child{padding-left:22px}}
#app .rm-sec .grow-in>.wrap{width:min(1296px,calc(100% - 144px)) !important;max-width:none !important;margin-inline:auto !important}
@media (max-width:820px){#app .rm-sec .grow-in>.wrap{width:calc(100% - 48px) !important}}
#app .rm-line{vector-effect:none}
/* GROWTH How we grow: 「화면 보기」 카드 사이 펼침(v250) — 뒤 카드가 밀려나고 그 사이에 카드 높이의 화면 */
#app .ps-inl{display:none}
@media (min-width:1101px) and (hover:hover) and (pointer:fine){
 #app .pv2 #pv-how .ps-field{overflow-x:clip !important;overflow-y:visible !important}
 #app .pv2 #pv-how .ps-list[data-inl]{display:flex !important;flex-wrap:nowrap;align-items:stretch;transition:transform .7s cubic-bezier(.22,1,.36,1)}
 #app .pv2 #pv-how .ps-list[data-inl]>.ps-card{flex:0 0 calc((100% - 3 * clamp(12px,1.4vw,20px)) / 4);width:auto !important;max-width:none !important}
 #app .pv2 #pv-how .ps-list[data-inl]>.ps-card:hover{translate:0 0 !important}
 #app .pv2 #pv-how .ps-list[data-inl]>.ps-card.is-inl{border-color:rgba(253,69,51,.5) !important}
 #app .ps-list[data-inl]>.ps-inl{display:block;position:relative;flex:0 0 0;margin-left:calc(-1 * clamp(12px,1.4vw,20px));min-width:0;overflow:hidden;opacity:0;transition:flex-basis .7s cubic-bezier(.22,1,.36,1),margin .7s cubic-bezier(.22,1,.36,1),opacity .35s ease}
 #app .ps-list[data-inl]>.ps-inl.on{flex-basis:var(--pw,0px);margin-left:0;opacity:1;transition:flex-basis .7s cubic-bezier(.22,1,.36,1),margin .7s cubic-bezier(.22,1,.36,1),opacity .45s ease .18s}
 #app .ps-inl-in{position:absolute;inset:0;display:flex;gap:10px}
 #app .pi-f{position:relative;flex:0 0 auto;height:100%;aspect-ratio:var(--ar);margin:0;border-radius:12px;overflow:hidden;background:#0c0c0e;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 24px 48px -32px rgba(0,0,0,.8)}
 #app .pi-f.is-phone{border-radius:18px}
 #app .pi-f img{display:block;width:100%;height:100%;object-fit:cover;object-position:0 0;transform:scale(1.03);transition:transform .9s cubic-bezier(.22,1,.36,1)}
 #app .ps-inl.on .pi-f img{transform:none}
 #app .pi-f::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 1px 0 rgba(255,255,255,.12);pointer-events:none}
}
@media (prefers-reduced-motion:reduce){#app .ps-list[data-inl],#app .ps-list[data-inl]>.ps-inl{transition:none !important}}
@media (min-width:1101px) and (hover:hover) and (pointer:fine){#app .pv2 #pv-how .ps-list[data-inl]{align-items:stretch !important}#app .ps-list[data-inl]>.ps-inl{align-self:stretch !important;height:auto !important}}
/* Ch1 사람이 정하는 것: 위 단계 레일과 같은 결 — 하나의 줄 위 세 관문(마디 · 번호 · 제목 · 문장) */
#app .ch1-who2>ul{display:none}
#app .ch1-gate{list-style:none;margin:14px 0 0;padding:26px 0 0;position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
#app .ch1-gate::before{content:"";position:absolute;left:0;right:0;top:4px;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.16),rgba(253,69,51,.55) 50%,rgba(255,255,255,.16))}
#app .ch1-gate li{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:10px;row-gap:8px;align-items:baseline;padding:16px 28px 22px;transition:background .5s ease}
#app .ch1-gate li:first-child{padding-left:4px}
#app .ch1-gate li+li{box-shadow:inset 1px 0 0 rgba(255,255,255,.1)}
#app .ch1-gate i{position:absolute;left:28px;top:-26px;width:9px;height:9px;border-radius:50%;background:#121214;box-shadow:inset 0 0 0 1.5px #fd4533;transition:background .4s ease,box-shadow .4s ease}
#app .ch1-gate li:first-child i{left:4px}
#app .ch1-gate em{font:700 10.5px/1 var(--en);font-style:normal;letter-spacing:.12em;color:#fd4533}
#app .ch1-gate b{font:800 clamp(17px,1.35vw,19px)/1.3 var(--kr);letter-spacing:-.03em;color:#fff;transition:color .4s ease}
#app .ch1-gate span{grid-column:2;font:400 14px/1.65 var(--kr);color:rgba(255,255,255,.64);word-break:keep-all}
#app .ch1-gate li:hover{background:linear-gradient(180deg,rgba(253,69,51,.09),transparent 80%)}
#app .ch1-gate li:hover b{color:#fd4533}
#app .ch1-gate li:hover i{background:#fd4533;box-shadow:inset 0 0 0 1.5px #fd4533,0 0 0 5px rgba(253,69,51,.14)}
#app .ch1-who2 .ch1-foot{margin:0;padding:14px 4px 0;border-top:1px solid rgba(255,255,255,.1)}
@media (max-width:900px){#app .ch1-gate{grid-template-columns:1fr;padding:0 0 0 22px}
 #app .ch1-gate::before{left:4px;right:auto;top:8px;bottom:8px;width:1px;height:auto;background:linear-gradient(180deg,rgba(255,255,255,.2),rgba(253,69,51,.6))}
 #app .ch1-gate li,#app .ch1-gate li:first-child{padding:14px 0}#app .ch1-gate li+li{box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
 #app .ch1-gate i,#app .ch1-gate li:first-child i{left:-22px;top:17px}}
#app .ch1-gate li{align-content:start}
/* Sound Familiar 아이콘: 작고 촘촘하게 */
#app .pvc-viz{position:relative !important;margin:22px 0 26px !important;width:min(100%,250px);height:auto !important}
#app .pvc-viz canvas{display:block;width:100% !important;height:auto !important;aspect-ratio:5/3 !important;background:transparent !important;box-shadow:none !important;border-radius:0 !important}
@media (max-width:900px){#app .pvc-viz{width:min(100%,220px);margin:16px 0 18px !important}}
@media (min-width:901px){#app .pv2 #pv-wd .wrap>.hl.rv,#app #pv-wd .wrap>.hl{margin-bottom:clamp(40px,4.4vw,72px) !important}}
/* 서비스 How we grow 배경: 띠 모양 그라데이션 대신 위 제목까지 넓게 번지는 타원 마스크로 자연스럽게 이음 */
#app .pv2 #pv-how>.wrap>.hl,#app .pv2 #pv-how .hl{position:relative;z-index:2}
#app .pv2 #pv-how .ps-list{position:relative;z-index:1}
#app .pv2 #pv-how .ps-rocks{inset:calc(-1 * clamp(300px,34vw,520px)) -4% -10% !important;opacity:.78 !important;
 -webkit-mask-image:radial-gradient(120% 78% at 50% 64%,#000 26%,rgba(0,0,0,.72) 42%,rgba(0,0,0,.34) 60%,rgba(0,0,0,.1) 74%,transparent 88%) !important;
 mask-image:radial-gradient(120% 78% at 50% 64%,#000 26%,rgba(0,0,0,.72) 42%,rgba(0,0,0,.34) 60%,rgba(0,0,0,.1) 74%,transparent 88%) !important;-webkit-mask-composite:source-over;mask-composite:add}
#app .pv2 #pv-how .ps-rocks{inset:calc(-1 * clamp(300px,34vw,520px)) 0 0 !important;
 -webkit-mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.12) 16%,rgba(0,0,0,.36) 32%,rgba(0,0,0,.78) 46%,#000 56%,#000 66%,rgba(0,0,0,.55) 82%,transparent 100%),linear-gradient(90deg,transparent 0,#000 14%,#000 86%,transparent 100%) !important;
 mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.12) 16%,rgba(0,0,0,.36) 32%,rgba(0,0,0,.78) 46%,#000 56%,#000 66%,rgba(0,0,0,.55) 82%,transparent 100%),linear-gradient(90deg,transparent 0,#000 14%,#000 86%,transparent 100%) !important;
 -webkit-mask-composite:source-in !important;mask-composite:intersect !important}
/* 모바일 키비주얼: 벽돌 배경을 낮춰 글자 · 서비스 목록과 겹쳐 보이지 않게 */
@media (max-width:900px){
 #app #top .wall-in>canvas:first-child{opacity:.42 !important;filter:brightness(.72) saturate(.8) !important}
 #app #top .wall-in>canvas:nth-of-type(2){opacity:.6 !important}
 #app #top .wall-copy::before{content:"";position:absolute;inset:8% -10% -6%;z-index:-1;pointer-events:none;background:radial-gradient(70% 55% at 50% 48%,rgba(10,10,12,.72),rgba(10,10,12,.38) 60%,transparent 85%)}
 #app #top .wall-hero-foot::before{content:"";position:absolute;inset:-10% -6% -4%;z-index:-1;pointer-events:none;background:radial-gradient(80% 70% at 50% 50%,rgba(10,10,12,.78),rgba(10,10,12,.4) 62%,transparent 90%)}
}
@media (max-width:900px){#app #top .hsx-item:not(.is-one) .hsx-name{-webkit-text-stroke:1px rgba(255,255,255,.82) !important}#app #top .hsx-item.is-one .hsx-name{-webkit-text-stroke:1px rgba(253,69,51,.95) !important}}