/* ─────────────────────────────────────────────────────────
   Ponte · slim 시안 — /v9/style.css 위에 얹는 것만
   메뉴(작은 화면 접이식) · 더보기 버튼 · 하위 페이지 끝 CTA
   색 · 글꼴 · 간격은 v9 토큰을 그대로 쓴다
   ───────────────────────────────────────────────────────── */

/* 상단 메뉴: 오른쪽 묶음(도입 문의 + 접이 버튼) */
.nav-act{display:flex;align-items:center;gap:8px;flex:none}
.menu a[aria-current="page"]{color:var(--fg)}

/* 작은 화면 접이식 메뉴 — .menu 가 숨는 860px 이하에서만 */
.mtog{display:none;position:relative;width:38px;height:38px;flex:none;border-radius:999px;border:1px solid rgba(244,246,251,.22);background:transparent;cursor:pointer;padding:0;transition:border-color .25s}
.mtog:hover{border-color:rgba(244,246,251,.55)}
.mtog i{position:absolute;left:11px;width:14px;height:1.5px;background:var(--fg);transition:transform .35s var(--ease),opacity .25s}
.mtog i:nth-child(1){top:13.5px}.mtog i:nth-child(2){top:18px}.mtog i:nth-child(3){top:22.5px}
.mtog[aria-expanded="true"] i:nth-child(1){transform:translateY(4.5px) rotate(45deg)}
.mtog[aria-expanded="true"] i:nth-child(2){opacity:0}
.mtog[aria-expanded="true"] i:nth-child(3){transform:translateY(-4.5px) rotate(-45deg)}
.mpanel{border-top:1px solid var(--line2)}
.mpanel[hidden]{display:none}
.mpanel .c{display:flex;flex-direction:column;padding-block:8px 16px}
.mpanel a{display:flex;align-items:center;min-height:48px;font-size:15.5px;font-weight:500;color:var(--fg2);border-bottom:1px solid var(--line2)}
.mpanel a:last-child{border-bottom:0}
.mpanel a:hover,.mpanel a[aria-current="page"]{color:var(--fg)}
.nav.open{background:rgba(6,10,20,.97);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);border-color:var(--line2)}
@media (max-width:700px){.mtog{display:inline-block}}
@media (min-width:701px){.mpanel{display:none!important}}
@media (max-width:380px){.nav .btn.sm{padding-inline:12px;font-size:13.5px}}

/* 구역 끝 '더 보기' */
.more{margin-top:48px;display:flex}
@media (max-width:760px){.more{margin-top:36px}}

/* 하위 페이지 */
.fg{scroll-margin-top:92px}
.cta-end{align-items:center}
.cta-go{position:relative;display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-start}
@media (min-width:901px){.cta-go{justify-content:flex-end}}

/* ── 영상 자리 — 파일이 없어도 어두운 둥근 틀만 보인다(깨진 아이콘 없음) ── */
.vframe{position:relative;overflow:hidden;border-radius:24px;border:1px solid var(--line);
  background:radial-gradient(120% 80% at 50% 0%,rgba(255,106,31,0.045),transparent 60%),var(--bg3);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.85),0 0 90px -30px rgba(255,106,31,0.099)}
.vframe video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:transparent}
.vframe-wide{aspect-ratio:16/9;width:100%}
.vframe-reel{aspect-ratio:9/16;width:100%;border-radius:28px}

/* 하위 페이지 머리 */
.sub-hero{position:relative;overflow:hidden;padding:150px 0 0}
.sub-hero .c{position:relative}
.sub-hero .vframe-wide{margin-top:56px}
@media (max-width:760px){.sub-hero{padding-top:112px}.sub-hero .vframe-wide{margin-top:36px;border-radius:18px}}

/* 기능 페이지: 메인에 있는 핵심 기능은 이름만, 누르면 메인으로 */
.core{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}
.core .eyebrow{flex:none}
.core-tags{margin-top:0}
.core-tags{gap:8px}
.core-tags a{font-size:13px;font-weight:500;padding:6px 12px;border-radius:999px;border:1px solid var(--line);color:var(--fg2);transition:color .25s,border-color .25s}
.core-tags a:hover{color:var(--fg);border-color:rgba(244,246,251,.4)}
.core + .feat{margin-top:56px}

/* 문의 칸: 왼쪽 글 + 세로 릴스, 오른쪽 폼 */
.cta-r{grid-template-areas:"txt form" "reel form";grid-template-rows:auto 1fr;row-gap:36px;align-items:start}
.cta-r .cta-txt{grid-area:txt}
.cta-r .cta-reel{grid-area:reel;position:relative;width:min(340px,100%)}
.cta-r .form{grid-area:form;align-self:center}
@media (max-width:900px){
  .cta-r{grid-template-areas:"txt" "reel" "form";grid-template-columns:minmax(0,1fr);row-gap:32px}
  .cta-r .cta-reel{width:100%}
}

/* 도입 페이지: 머리 영상 바로 아래 단계 — 빈 간격 줄임 */
.sec-proc-top{padding-top:40px}

/* 메인 도입 단계(제목만): 좁은 화면에서도 3칸 */
@media (max-width:1000px){.sec-proc-s .steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 20px}}
@media (max-width:560px){.sec-proc-s .st-n{font-size:32px}.sec-proc-s .st h3{margin-top:12px;font-size:1rem}}

/* 문의: 폼만 */
.cta.form-only,.cta.cta-r.form-only{display:block;max-width:640px;margin-inline:auto}
.cta.form-only .form{width:100%}

/* ── 메뉴 전환 애니메이션 ── */
@view-transition{navigation:auto}
::view-transition-old(root){animation:t-page-out var(--duration-quick) ease-in both}
::view-transition-new(root){animation:t-page-in var(--duration-slow) var(--ease-smooth-out) both}
@keyframes pt-out{to{opacity:0;transform:translateY(-8px)}}
@keyframes pt-in{from{opacity:0}}
.nav{view-transition-name:pt-nav}
::view-transition-old(pt-nav),::view-transition-new(pt-nav){animation:none}
/* 보기 전환을 못 쓰는 브라우저용 */
body.pt-leave main,body.pt-leave section,body.pt-leave footer{opacity:0;transform:translateY(-8px);transition:opacity .28s ease,transform .28s ease}
body.pt-enter{animation:pt-in .5s cubic-bezier(.16,1,.3,1) both}
/* 메뉴 밑줄: 지금 있는 곳 · 마우스 올림 */
.menu a{position:relative;transition:color .25s}
.menu a::after{content:"";position:absolute;left:12%;right:12%;bottom:-6px;height:2px;border-radius:2px;background:var(--rim);transform:scaleX(0);transform-origin:50% 50%;transition:transform .35s cubic-bezier(.16,1,.3,1)}
.menu a:hover::after,.menu a.on::after{transform:scaleX(1)}
.menu a.on{color:var(--fg)}
@media (prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}body.pt-enter{animation:none}}
section[id],[id="product"],[id="faq"],[id="contact"]{scroll-margin-top:84px}

/* ── 움직임 (transitions.dev 기준: 짧은 거리 · 가벼운 흐림 · 들어올 때보다 빨리 나감 · 40ms 차례) ── */
:root{--duration-stagger:40ms;--duration-micro:80ms;--duration-quick:150ms;--duration-fast:250ms;--duration-medium:350ms;--duration-slow:400ms;--duration-very-slow:500ms;
  --ease-smooth-out:cubic-bezier(.22,1,.36,1);--ease-bounce:cubic-bezier(.34,1.36,.64,1);
  --distance-micro:4px;--distance-small:6px;--distance-base:8px;--distance-medium:12px;--blur-small:2px;--blur-medium:3px;--scale-large:.96;--scale-small:.98}
@keyframes t-page-out{to{opacity:0;transform:translateY(calc(var(--distance-base) * -1));filter:blur(var(--blur-small))}}
@keyframes t-page-in{from{opacity:0;transform:translateY(var(--distance-base));filter:blur(var(--blur-medium))}}
@keyframes t-rise{from{opacity:0;transform:translateY(var(--distance-medium));filter:blur(var(--blur-medium))}}
@keyframes t-text{from{opacity:0;transform:translateY(var(--distance-micro));filter:blur(var(--blur-small))}}
@keyframes t-draw{to{stroke-dashoffset:0}}
@keyframes t-pop{from{opacity:0;transform:scale(.6)}}
@keyframes t-shake{20%{transform:translateX(calc(var(--distance-base) * -1))}40%{transform:translateX(var(--distance-base))}60%{transform:translateX(calc(var(--distance-small) * -1))}80%{transform:translateX(var(--distance-small))}}

/* 등장: 문단이 흐림을 벗으며 살짝 올라온다 */
.js .rv{opacity:0;transform:translateY(var(--distance-medium));filter:blur(var(--blur-medium));
  transition:opacity var(--duration-very-slow) ease-in-out,transform var(--duration-very-slow) var(--ease-smooth-out),filter var(--duration-very-slow) ease-in-out}
.js .rv.in{opacity:1;transform:none;filter:none}
/* 첫 화면 제목 */
.h1 .ln{overflow:visible}
.js .h1 .ln i{animation:t-rise var(--duration-very-slow) var(--ease-smooth-out) both}
.js .h1 .ln:nth-child(2) i{animation-delay:var(--duration-micro)}
/* 버튼 누름 */
.btn:active{transform:scale(var(--scale-small));transition-duration:var(--duration-quick)}
.btn svg{transition:transform var(--duration-fast) var(--ease-smooth-out)}
/* 문의 오류: 짧게 흔들고 제자리 */
.shake{animation:t-shake var(--duration-slow) ease-in-out}

@media (prefers-reduced-motion:no-preference){
  /* 작은 화면 메뉴: 항목이 차례로 */
  .mpanel:not([hidden]) a{animation:t-rise var(--duration-fast) var(--ease-smooth-out) both}
  .mpanel:not([hidden]) a:nth-child(2){animation-delay:calc(var(--duration-stagger) * 1)}
  .mpanel:not([hidden]) a:nth-child(3){animation-delay:calc(var(--duration-stagger) * 2)}
  .mpanel:not([hidden]) a:nth-child(4){animation-delay:calc(var(--duration-stagger) * 3)}
  .mpanel:not([hidden]) a:nth-child(5){animation-delay:calc(var(--duration-stagger) * 4)}
  .mpanel:not([hidden]) a:nth-child(6){animation-delay:calc(var(--duration-stagger) * 5)}
  /* 자주 묻는 질문: 높이가 부드럽게 열리고 답이 흐림을 벗는다 */
  .js .faq details[open] .a{animation:t-text var(--duration-slow) var(--ease-smooth-out) both}
  .faq summary i::before,.faq summary i::after{transition:transform var(--duration-fast) var(--ease-smooth-out)}
  /* 접수 완료 창: 열 때 250ms · 닫을 때 150ms, 체크는 그려진다 */
  .dm{transition:opacity var(--duration-quick) ease-out}
  .dm.show{transition-duration:var(--duration-fast)}
  .dm-card{opacity:0;transform:scale(var(--scale-large));transition:transform var(--duration-quick) var(--ease-smooth-out),opacity var(--duration-quick) ease-out}
  .dm.show .dm-card{opacity:1;transform:none;transition-duration:var(--duration-fast)}
  .dm.show .dm-ic{animation:t-pop var(--duration-very-slow) var(--ease-bounce) both}
  .dm-ic svg path{stroke-dasharray:22;stroke-dashoffset:22}
  .dm.show .dm-ic svg path{animation:t-draw var(--duration-very-slow) var(--ease-smooth-out) var(--duration-fast) forwards}
}
@media (prefers-reduced-motion:reduce){.dm-ic svg path{stroke-dashoffset:0}.shake{animation:none}}

/* 메뉴 닫힘 — 천천히 시작해 빨라지며 접힌다 */
@keyframes m-panel-out{from{clip-path:inset(0 0 0 0);opacity:1}to{clip-path:inset(0 0 100% 0);opacity:0}}
@keyframes m-link-out{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-8px)}}
.mpanel.closing{animation:m-panel-out .42s cubic-bezier(.55,0,.85,.25) both}
.mpanel.closing a{animation:m-link-out .3s cubic-bezier(.55,0,.85,.25) both}
.mpanel.closing a:nth-last-child(2){animation-delay:.03s}.mpanel.closing a:nth-last-child(3){animation-delay:.06s}.mpanel.closing a:nth-last-child(4){animation-delay:.09s}.mpanel.closing a:nth-last-child(5){animation-delay:.12s}

/* 선택 칸(거래처 수) — 폼과 같은 모양의 목록 */
.csel{position:relative}
.csel-native{position:absolute;inset:0;opacity:0;pointer-events:none}
.csel-btn{width:100%;height:50px;padding:0 44px 0 16px;border-radius:12px;border:1px solid rgba(244,246,251,.14);background:rgba(244,246,251,.04);color:var(--fg);font:inherit;font-size:15px;text-align:left;cursor:pointer;position:relative;transition:border-color .2s,background .2s,box-shadow .2s}
.csel-btn::after{content:"";position:absolute;right:18px;top:50%;width:8px;height:8px;border-right:1.5px solid var(--fg2);border-bottom:1.5px solid var(--fg2);transform:translateY(-70%) rotate(45deg);transition:transform .3s cubic-bezier(.22,1,.36,1)}
.csel.open .csel-btn{border-color:rgba(255,106,31,0.315);background:rgba(244,246,251,.07);box-shadow:0 0 0 3px rgba(255,106,31,0.068)}
.csel.open .csel-btn::after{transform:translateY(-30%) rotate(-135deg)}
.csel-list{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:30;list-style:none;margin:0;padding:6px;border-radius:14px;background:#0e1424;border:1px solid rgba(244,246,251,.14);box-shadow:0 24px 48px -16px rgba(0,0,0,.7);opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top center;pointer-events:none;transition:opacity .22s cubic-bezier(.22,1,.36,1),transform .28s cubic-bezier(.22,1,.36,1)}
.csel.open .csel-list{opacity:1;transform:none;pointer-events:auto}
.csel-list li{display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:0 12px;border-radius:9px;font-size:15px;color:var(--fg2);cursor:pointer;transition:background .15s,color .15s}
.csel-list li:hover,.csel-list li.hi{background:rgba(244,246,251,.07);color:var(--fg)}
.csel-list li[aria-selected="true"]{color:var(--fg)}
.csel-list li[aria-selected="true"]::after{content:"";width:6px;height:11px;border-right:2px solid #8fbcff;border-bottom:2px solid #8fbcff;transform:rotate(45deg) translate(-2px,-2px)}
@media (prefers-reduced-motion:reduce){.mpanel.closing,.mpanel.closing a{animation:none}.csel-list{transition:none}}

/* 제휴 문의 팝업 — 이메일 · 내용 · 보내기 */
.pmodal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}
.pmodal[hidden]{display:none}
.pmodal-bg{position:absolute;inset:0;background:rgba(3,6,14,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .3s cubic-bezier(.22,1,.36,1)}
.pmodal-box{position:relative;width:100%;max-width:440px;display:flex;flex-direction:column;gap:16px;padding:28px 24px 22px;border-radius:20px;background:#0c1222;border:1px solid rgba(244,246,251,.12);box-shadow:0 40px 80px -24px rgba(0,0,0,.8);opacity:0;transform:translateY(14px) scale(.98);transition:opacity .3s cubic-bezier(.22,1,.36,1),transform .38s cubic-bezier(.22,1,.36,1)}
.pmodal.in .pmodal-bg{opacity:1}.pmodal.in .pmodal-box{opacity:1;transform:none}
.pmodal.out .pmodal-bg{opacity:0;transition-timing-function:cubic-bezier(.55,0,.85,.25)}
.pmodal.out .pmodal-box{opacity:0;transform:translateY(10px) scale(.98);transition-timing-function:cubic-bezier(.55,0,.85,.25)}
.pmodal-x{position:absolute;right:14px;top:14px;width:34px;height:34px;border-radius:999px;border:1px solid rgba(244,246,251,.16);background:transparent;cursor:pointer}
.pmodal-x::before,.pmodal-x::after{content:"";position:absolute;left:10px;top:16px;width:13px;height:1.5px;background:var(--fg2)}
.pmodal-x::before{transform:rotate(45deg)}.pmodal-x::after{transform:rotate(-45deg)}
.pf{display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--fg2)}
.pf input,.pf textarea{width:100%;padding:14px 16px;border-radius:12px;border:1px solid rgba(244,246,251,.14);background:rgba(244,246,251,.04);color:var(--fg);font:inherit;font-size:15px;outline:none;resize:vertical;transition:border-color .2s,box-shadow .2s}
.pf input{height:50px;padding-block:0}
.pf input:focus,.pf textarea:focus{border-color:rgba(255,106,31,0.315);box-shadow:0 0 0 3px rgba(255,106,31,0.068)}
.pf-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.pf-send{width:100%;justify-content:center;margin-top:4px}
.pf-msg{margin:0;min-height:20px;font-size:13.5px;color:var(--fg2);text-align:center}
.pf-msg.bad{color:#ff8f8f}
@media (max-width:560px){.pmodal{align-items:flex-end;padding:0}.pmodal-box{max-width:none;border-radius:20px 20px 0 0;padding-bottom:calc(22px + env(safe-area-inset-bottom))}.pmodal-box{transform:translateY(40px)}}
@media (prefers-reduced-motion:reduce){.pmodal-bg,.pmodal-box{transition:none}}

/* ── 블로그 톤(흰 바탕 · 먹색 글자 · 주황 포인트) — 색만 바꾼 시안 ── */
:root{color-scheme:light;
  --bg:#ffffff;--bg2:#fafafa;--bg3:#f4f4f5;
  --fg:#121212;--fg2:#4d4d4d;--fg3:#8c8c8c;
  --line:#ececec;--line2:#f3f3f3;
  --rim:#ff6a1f;--rim-soft:rgba(255,106,31,.12);
  --accent:#ff6a1f;
}
html,body{background:#fff;color:#121212}
.btn-w:hover{background:#fff;box-shadow:0 8px 24px -10px rgba(255,106,31,.5)}
.csel-list li[aria-selected="true"]::after{border-color:#ff6a1f}
.dm-ic svg{stroke:#ff6a1f}
.dm-card,.pmodal-box,.csel-list{background:#fff;border-color:#ececec}
.ceo-shot,.vimg{background:#f4f4f5;box-shadow:0 30px 60px -30px rgba(0,0,0,.18)}
.pf-msg.bad{color:#d4380d}

/* ── 폼 윤곽 · 제휴 문의 안내 ── */
.pmodal-bg{background:rgba(18,18,18,.45)}
.pmodal-box{background:#fff;border:1px solid #d9d9d9;box-shadow:0 30px 60px -28px rgba(0,0,0,.25);max-height:calc(100vh - 32px);overflow:auto}
.pmodal-x{border:1px solid #cfcfcf}
.pm-h{margin:0;font-size:22px;font-weight:700;letter-spacing:-.02em;color:#121212;padding-right:40px}
.pm-d{margin:0;font-size:14px;line-height:1.7;color:#4d4d4d}
.pm-l{margin:0;padding:0 0 0 18px;font-size:13.5px;line-height:1.7;color:#4d4d4d}
.pm-n{margin:0;font-size:13px;color:#8c8c8c}
.pf input,.pf textarea,.fld input,.fld select,.csel-btn{border:1.5px solid #cfcfcf!important;background:#fff!important;color:#121212}
.pf input:focus,.pf textarea:focus,.fld input:focus,.fld select:focus,.csel-btn:focus-visible{border-color:#ff6a1f!important;box-shadow:0 0 0 3px rgba(255,106,31,.16)!important}
.fld input[type=checkbox]{border:1.5px solid #bdbdbd!important}
.csel-list{border:1.5px solid #cfcfcf}
.cta{border:1px solid #e0e0e0;background:#fafafa}

/* ── 빈칸 줄이기: 구역 위아래 간격 ── */
.sec{padding-block:96px}
.split-f{margin-top:28px}
@media (max-width:760px){.sec{padding-block:60px}}
.nav.open{background:rgba(255,255,255,.98);border-color:#ececec}
/* 아이패드 · 아이폰 사파리: 상단 바 view-transition 이름이 스크롤 중 바를 가리는 문제 */
@supports (-webkit-touch-callout:none){.nav{view-transition-name:none}}
/* 구형 아이패드 — 팝업 뒤 흐림 효과가 닫힌 뒤에도 남는 문제: 흐림 대신 단색 */
.pmodal-bg{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.pmodal[hidden]{display:none!important;visibility:hidden}
/* 아이패드 · 아이폰: 맨 위에서 상단 메뉴가 사라지는 문제 — body 의 overflow-x:hidden 이 fixed 를 깨뜨려 제거(clip 만 사용), 바를 별도 층에 고정 */
.nav{position:fixed!important;top:0!important;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1!important;visibility:visible!important}
/* 버튼 효과 — 개발 이야기 버튼과 같게(흰 바탕 위 글자가 사라지던 hover 수정): 색은 그대로, 살짝 떠오르며 그림자 */
.btn{transition:transform .2s,box-shadow .2s,background .2s,border-color .2s,color .2s}
.btn-w,.btn-w:hover{background:#121212;color:#fff}
.btn-w:hover{transform:translateY(-1px);box-shadow:0 8px 20px -8px rgba(11,18,32,.45)}
.btn-o{background:#fff;color:#121212;border-color:#cfcfcf}
.btn-o:hover{background:#fff4ec;border-color:#ffb98a;color:#121212;transform:translateY(-1px);box-shadow:0 8px 20px -10px rgba(255,106,31,.35)}
.btn:active{transform:scale(.97)}

/* ═════ 홈 전체 리디자인 — 개발 이야기 스타일(굵은 제목 · 평평한 파스텔 면 · 알약 버튼) ═════ */
:root{--pa-yel:#ffd54a;--pa-cream:#fff4ec;--pa-butter:#fff8d6;--pa-mint:#e8f6ee;--pa-sky:#e8f1ff}
body{background:#fff;color:#121212}
.h1,.h2{font-weight:800;letter-spacing:-.035em;color:#121212;line-height:1.18}
.h1 .dim,.h2 .dim,.dim{color:#121212;opacity:.38}
.eyebrow{display:inline-flex;align-items:center;height:30px;padding:0 13px;border-radius:999px;background:#121212;color:#fff;font:600 13px/1 var(--sans);letter-spacing:0;text-transform:none;margin-bottom:14px}
/* 히어로 = 노란 큰 면 */
.hero{background:var(--pa-yel);border-radius:32px;margin:84px 20px 0;padding-block:56px;overflow:hidden}
.hero .glow{display:none!important}
.hero .h1{color:#121212}
.hero .h1 .dim{opacity:1;color:#121212;background:#121212;color:#fff;padding:0 .2em;border-radius:6px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.hero-reel-v,.hero-reel-w{border-radius:28px}
.works{background:transparent;border:0}
.tool{background:#fff;border:1px solid #ececec;box-shadow:none}
/* 섹션 = 평평한 파스텔 면 */
#split.sec{background:var(--pa-cream);border-radius:32px;margin:20px 20px 0;padding-top:72px}
#product.sec{background:var(--pa-mint);border-radius:32px;margin:20px 20px 0}
#faq.sec{background:#fff}
#contact.sec{background:var(--pa-butter);border-radius:32px;margin:20px 20px 0}
.demo-sec{background:var(--pa-sky);border-radius:32px;margin:20px 20px 0}
/* 안쪽 카드 — 그라데이션 · 큰 그림자 없이 흰 면 */
.sec [class*="card"],.sec [class*="panel"],.sec [class*="box"],.bento>*,.feat,.form,#contact form,.faqw details{background:#fff!important;background-image:none!important;border:0!important;box-shadow:none!important;border-radius:24px}
.faqw details{border-radius:20px;margin-bottom:8px}
.faqw details summary{font-weight:700}
.fld input,.fld textarea,.csel-btn{background:#fff;border:1.5px solid #d9d9d9;border-radius:14px}
/* 버튼 */
.btn{border-radius:999px;font-weight:700}
.btn-w{background:#121212!important;color:#fff!important}
/* 메뉴 눌렀을 때 — 알약 선택 */
.menu a{transition:background .18s,color .18s,transform .18s}
.menu a:hover{background:transparent;color:#121212}
.menu a:active,.menu a:focus-visible{background:transparent;color:#121212}
.menu a.on,.menu a[aria-current]{background:transparent;color:#121212;font-weight:600}
@media(max-width:700px){.hero,#split.sec,#product.sec,#contact.sec,.demo-sec{margin-inline:12px;border-radius:24px}.hero{margin-top:76px;padding-block:36px}}
/* 아이패드 · 아이폰 — 위로 스크롤할 때 버벅이는(뻑나는) 원인 제거: 흐림 · 합성층 · 전환 효과 끔 */
@supports (-webkit-touch-callout:none){
  .nav,.nav.solid,.nav.open,.hd{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:#fff!important;will-change:auto!important}
  .js .rv,.rv{filter:none!important;transition:opacity .5s,transform .6s!important}
  .hero-reel-w,.hero-reel-v{will-change:auto!important;transform-style:flat!important}
  .glow{display:none!important}
  .pmodal-bg{-webkit-backdrop-filter:none!important}
  *{-webkit-tap-highlight-color:transparent}
}
/* 핵심 기능 · 문의 — 흰 카드 */
.prod-main,.prod-list,.prow,.cta.form-only,.form{background:#fff!important;background-image:none!important;border:0!important;box-shadow:none!important;border-radius:24px}
.prod-main{padding:28px}.prod-list{padding:8px 28px}
.prow{border-radius:0;border-bottom:1px solid #f0f0f0!important}.prow:last-child{border-bottom:0!important}
.cta.form-only{padding:32px}
.chan,.biz,.alert,.pvis *[class*="chip"]{box-shadow:none!important}
/* 아이패드 · 아이폰: body 에 애니메이션 · 변형이 남으면 fixed 메뉴가 같이 스크롤돼 사라진다 → 전부 제거, 메뉴는 화면에 고정 */
@supports (-webkit-touch-callout:none){
  body,body.pt-enter,html{animation:none!important;transform:none!important;filter:none!important;-webkit-transform:none!important}
  .nav{position:fixed!important;top:0!important;left:0!important;right:0!important}
}
/* 파스텔 면 → 은은한 그라데이션(흰 바탕에 연한 주황빛이 번지는 정도) */
.hero{background:radial-gradient(120% 90% at 85% 0%,rgba(255,106,31,.13),rgba(255,106,31,0) 60%),linear-gradient(180deg,#fff7f0 0%,#fff 100%)!important;border-radius:0;margin:0;padding-block:96px 56px}
.hero .h1 .dim{background:none;color:#121212;opacity:.38;padding:0}
#split.sec,#product.sec,#contact.sec,.demo-sec{border-radius:0!important;margin:0!important}
#split.sec{background:linear-gradient(180deg,#fff 0%,#fff8f2 55%,#fff 100%)!important}
#product.sec{background:linear-gradient(180deg,#fff 0%,rgba(255,106,31,.06) 50%,#fff 100%)!important}
.demo-sec{background:linear-gradient(180deg,#fff 0%,#fff9f4 50%,#fff 100%)!important}
#contact.sec{background:radial-gradient(90% 70% at 50% 100%,rgba(255,106,31,.12),rgba(255,106,31,0) 70%),#fff!important}
.sec [class*="card"],.sec [class*="panel"],.sec [class*="box"],.bento>*,.feat,.prod-main,.prod-list,.cta.form-only,.form,.faqw details{background:#fff!important;border:1px solid #f0e6de!important;box-shadow:0 18px 40px -28px rgba(255,106,31,.25)!important}
.eyebrow{background:rgba(255,106,31,.1);color:#d4520f}
@media(max-width:700px){.hero{padding-block:84px 36px}}
/* FAQ — 기존 스타일 복구(카드 테두리 · 그림자 · 둥근 모서리 제거) */
.faqw details,.faqw details[open]{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;margin-bottom:0!important}
/* FAQ — 항목 사이 가는 선 원래대로 */
.faq details,.faqw details{border:0!important;border-bottom:1px solid #e4e4e4!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.faq details:first-child,.faqw details:first-child{border-top:1px solid #e4e4e4!important}
.faq details,.faqw details{border-bottom:1px solid #c9c9c9!important}
.faq details:first-child,.faqw details:first-child{border-top:1px solid #c9c9c9!important}
/* FAQ — 열린 항목에서 선이 사라지던 문제(이전 규칙이 [open] 에서 테두리를 0 으로 덮었다) */
.faq details[open],.faqw details[open]{border:0!important;border-bottom:1px solid #c9c9c9!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.faq details:first-child[open],.faqw details:first-child[open]{border-top:1px solid #c9c9c9!important}
.faq details{box-sizing:border-box}
/* 모바일 메뉴 — 둥근 알약이 아니라 구분선이 있는 목록(블로그 메뉴와 같게). 현재 페이지는 주황 굵게 */
.mpanel{padding:0 20px 8px}
.mpanel a{display:block;height:auto;margin:0;padding:18px 0;border:0;border-bottom:1px solid #ececec;border-radius:0;background:none;color:#121212;font-size:15px;font-weight:500;transform:none}
.mpanel a:last-child{border-bottom:0}
.mpanel a:hover,.mpanel a:active{background:none;color:#121212;transform:none}
.mpanel a[aria-current="page"],.mpanel a.on{background:none;color:#f26b1d;font-weight:700}
.mtog:active,.nav.open .mtog{background:transparent;border-color:#cfcfcf}
.nav.open .mtog i{background:#121212}
/* 기능 목록 바깥 박스 — 테두리 · 둥근 모서리 제거(글이 박스 끝에 붙어 보이던 문제) */
.feat{border:0!important;box-shadow:none!important;border-radius:0!important;background:transparent!important}

/* 페이지 이동 효과 제거 — 보기 전환(번쩍임 · 이전 화면 잔상)과 페이드를 끈다 */
@view-transition{navigation:none}
::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
.nav{view-transition-name:none!important}
body.pt-enter{animation:none!important}
body.pt-leave main,body.pt-leave section,body.pt-leave footer{opacity:1!important;transform:none!important;transition:none!important}

/* 문의 폼 — 카드 안쪽 하얀 상자(어긋난 사각형) 제거: 바깥 카드 하나만 남긴다 */
.cta.form-only .form,#contact .form,#contact form,.form{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important}
.cta.form-only{padding:36px!important}
.cta.form-only .form{padding:0!important}

/* 페이지 들어올 때 깜빡이던 등장 효과(흐림 · 올라옴 · 서서히 나타남) 제거 — 내용이 처음부터 그대로 보인다 */
.js .rv,.js .rv.in,.rv{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
.js .h1 .ln i,.js .h1 .ln:nth-child(2) i,.js .hero-cta{animation:none!important}
.js .ceo-dev,.js .vc{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}