:root{
      --bg:#ffffff;
      --bg-soft:#f5f7fa;
      --bg-soft2:#eef1f6;
      --text:#16181d;
      --text-sub:#5b6270;
      --text-mute:#8b93a3;
      --line:#e6e9ef;
      --brand1:#00b3e6;
      --brand2:#6b3ff7;
      --accent:#5b5bf0;
      --grad:linear-gradient(135deg,#00b3e6 0%,#6b3ff7 100%);
      --shadow:0 10px 40px rgba(20,24,40,.08);
      --shadow-sm:0 4px 18px rgba(20,24,40,.06);
      --radius:18px;
      --maxw:1180px;
    }
    *{margin:0;padding:0;box-sizing:border-box}
    html{scroll-behavior:smooth;scroll-padding-top:118px}
    body{
      font-family:'Pretendard','Pretendard Variable',-apple-system,BlinkMacSystemFont,'Segoe UI','Malgun Gothic',sans-serif;
      background:var(--bg);color:var(--text);line-height:1.6;
      -webkit-font-smoothing:antialiased;letter-spacing:-.01em;
    }
    a{color:inherit;text-decoration:none}
    img{display:block;max-width:100%}
    .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
    .grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

    /* ───── Header ───── */
    header{position:fixed;top:0;left:0;right:0;z-index:1000;transition:.3s}
    .topbar{background:#17356b;color:#fff}
    .topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px;height:40px}
    .tb-msg{font-size:.9rem;font-weight:600;color:rgba(255,255,255,.88);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .tb-contact{display:flex;align-items:center;gap:13px;white-space:nowrap;font-size:.94rem;font-weight:700}
    .tb-contact a{display:inline-flex;align-items:center;gap:6px;color:#fff;transition:.2s}
    .tb-contact a:hover{color:#9fd4ff}
    .tb-sep{width:1px;height:14px;background:rgba(255,255,255,.28)}
    .navbar{position:relative;background:rgba(255,255,255,.88);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid transparent;transition:.3s}
    header.scrolled .navbar{border-bottom-color:var(--line);box-shadow:0 2px 20px rgba(20,24,40,.05)}
    .nav{display:flex;align-items:center;justify-content:space-between;height:68px;gap:20px}
    .logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:1.25rem;letter-spacing:-.03em;white-space:nowrap}
    .logo .mark{width:30px;height:30px;border-radius:9px;background:var(--grad);display:grid;place-items:center;color:#fff;font-size:.95rem;font-weight:900}
    .gnb{display:flex;gap:24px;align-items:center}
    .gnb a{font-size:.96rem;font-weight:600;color:var(--text-sub);transition:.2s;white-space:nowrap}
    .gnb a:hover{color:var(--text)}
    .nav-cta{display:inline-flex;align-items:center;gap:7px;padding:10px 20px;border-radius:999px;background:#17356b;color:#fff;font-weight:700;font-size:.92rem;box-shadow:0 6px 18px rgba(23,53,107,.3);transition:.2s}
    .nav-cta:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(23,53,107,.42)}
    .burger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px}
    .burger span{width:24px;height:2px;background:var(--text);border-radius:2px;transition:.3s}

    /* ───── Buttons ───── */
    .btn{display:inline-flex;align-items:center;gap:9px;padding:15px 28px;border-radius:14px;font-weight:700;font-size:1.02rem;cursor:pointer;border:none;transition:.22s}
    .btn-primary{background:#17356b;color:#fff;box-shadow:0 10px 28px rgba(23,53,107,.32)}
    .btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(23,53,107,.44)}
    .btn-ghost{background:#fff;color:var(--text);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
    .btn-ghost:hover{transform:translateY(-2px);border-color:#cfd5e0}
    .btn-ghost-dark{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px)}
    .btn-ghost-dark:hover{transform:translateY(-2px);background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.5)}

    /* ───── Section common ───── */
    section.block{padding:104px 0}
    .sec-head{text-align:center;max-width:680px;margin:0 auto 60px}
    .sec-tag{display:inline-block;font-size:.85rem;font-weight:800;letter-spacing:.08em;color:var(--accent);text-transform:uppercase;margin-bottom:14px}
    .sec-title{font-size:2.85rem;font-weight:800;letter-spacing:-.05em;line-height:1.22;display:inline-block;padding-bottom:16px;position:relative}
    /* 제목 밑줄 — 스크롤로 보일 때 좌→우로 천천히 그려짐 */
    .sec-title::after{content:'';position:absolute;left:0;right:0;bottom:0;height:6px;border-radius:3px;background:#1a5fd8;transform:scaleX(0);transform-origin:left;transition:transform 1.15s cubic-bezier(.16,1,.3,1) .18s}
    .sec-head.in .sec-title::after{transform:scaleX(1)}
    .sec-desc{font-size:1.08rem;color:var(--text-sub);margin-top:18px}

    /* ───── Company ───── */
    .company{background:var(--bg-soft)}
    .comp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
    .comp-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:34px 30px;transition:.25s}
    .comp-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
    .comp-card .ic{width:52px;height:52px;border-radius:14px;background:var(--bg-soft2);display:grid;place-items:center;font-size:1.5rem;margin-bottom:20px}
    .comp-card h3{font-size:1.22rem;font-weight:800;margin-bottom:10px}
    .comp-card p{color:var(--text-sub);font-size:.98rem}

    /* ───── Business / Services ───── */
    .svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
    .svc-card{position:relative;border:1px solid var(--line);border-radius:var(--radius);padding:38px 34px;overflow:hidden;background:#fff;transition:.25s}
    .svc-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent}
    .svc-card .no{font-size:.9rem;font-weight:800;color:var(--text-mute)}
    .svc-card h3{font-size:1.5rem;font-weight:800;margin:14px 0 12px}
    .svc-card p{color:var(--text-sub);margin-bottom:18px}
    .svc-tags{display:flex;flex-wrap:wrap;gap:8px}
    .svc-tags span{font-size:.82rem;font-weight:600;color:var(--accent);background:rgba(91,91,240,.08);padding:6px 12px;border-radius:8px}
    .svc-card .glow{position:absolute;right:-40px;top:-40px;width:150px;height:150px;border-radius:50%;background:var(--grad);opacity:0;filter:blur(30px);transition:.3s}
    .svc-card:hover .glow{opacity:.16}

    /* ───── Portfolio ───── */
    .portfolio{background:var(--bg-soft)}
    .filters{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:36px}
    .filter-btn{padding:9px 20px;border-radius:999px;border:1px solid var(--line);background:#fff;font-weight:700;font-size:.92rem;color:var(--text-sub);cursor:pointer;transition:.2s}
    .filter-btn.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(91,63,240,.25)}
    .pf-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
    .pf-item{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:3/4;background:var(--bg-soft2);cursor:pointer;box-shadow:var(--shadow-sm)}
    .pf-item img{width:100%;height:100%;object-fit:cover;transition:.4s}
    .pf-item:hover img{transform:scale(1.06)}
    .pf-item .pf-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(15,17,25,.82) 0%,transparent 55%);display:flex;align-items:flex-end;padding:16px;opacity:0;transition:.3s}
    .pf-item:hover .pf-ov{opacity:1}
    .pf-ov .pf-tags{display:flex;gap:6px;flex-wrap:wrap}
    .pf-ov .pf-tags span{font-size:.74rem;font-weight:700;color:#fff;background:rgba(255,255,255,.22);backdrop-filter:blur(4px);padding:4px 10px;border-radius:7px}
    .pf-more{text-align:center;margin-top:36px}

    /* ───── Showcase (직접 개발 앱 자동 시연 슬라이드) ───── */
    .showcase{background:#ffffff;color:var(--text);padding:96px 0;border-top:1px solid var(--line);overflow:hidden}
    #showcase-sv{padding-top:146px;border-top:none}
    /* 섹션 교대 배경 — 흰색 12연속 단조로움 해소 */
    .showcase.alt{background:#e7edf7;border-top-color:#d2dcec}
    .showcase.alt .sc-feats .feat{background:#fff;border-color:#d3dcea}
    .sc-stage{position:relative}
    .phone{position:absolute;right:26px;bottom:26px;z-index:10;width:162px;aspect-ratio:390/844;background:#fff;border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.16);overflow:hidden}
    .phone .notch{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:58px;height:13px;background:#000;border-radius:9px;z-index:3}
    .ph-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;transition:opacity .5s ease}
    .ph-img.fade{opacity:0}
    .browser{width:100%;border-radius:14px;overflow:hidden;background:#1c1f27;box-shadow:0 40px 100px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06)}
    .browser-bar{height:44px;display:flex;align-items:center;gap:14px;padding:0 16px;background:#20232c}
    .browser-bar .dots{display:flex;gap:8px;flex-shrink:0}
    .browser-bar .dots i{width:12px;height:12px;border-radius:50%;background:#3a3f4b;display:block}
    .browser-bar .url{flex:1;max-width:460px;margin:0 auto;height:26px;display:flex;align-items:center;justify-content:center;gap:6px;background:#171a21;border-radius:7px;padding:0 14px;font-size:.82rem;color:#9aa1b0;overflow:hidden;white-space:nowrap}
    .browser-screen{position:relative;aspect-ratio:1440/900;background:#fff;overflow:hidden}
    .sc-main{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;transition:opacity .4s ease}
    .sc-main.fade{opacity:0}
    .sc-main.kb{animation:kenburns 3.6s ease-out forwards}
    @keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.14)}}
    .fake-cursor{position:absolute;left:50%;top:55%;z-index:5;width:24px;height:24px;pointer-events:none;transition:left 1.05s cubic-bezier(.5,0,.2,1),top 1.05s cubic-bezier(.5,0,.2,1);filter:drop-shadow(0 2px 5px rgba(0,0,0,.45))}
    .fake-cursor svg{display:block;width:100%;height:100%}
    .fake-cursor::after{content:"";position:absolute;left:3px;top:3px;width:10px;height:10px;border:2px solid #5fd6ff;border-radius:50%;opacity:0}
    .fake-cursor.click::after{animation:ripple .55s ease-out}
    @keyframes ripple{from{transform:scale(.35);opacity:.9}to{transform:scale(3.6);opacity:0}}
    .sc-hint{position:absolute;left:16px;bottom:16px;z-index:6;background:rgba(11,13,18,.82);color:#fff;font-size:.88rem;font-weight:700;padding:8px 16px;border-radius:999px;backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.14)}
    .sc-dots{display:flex;gap:9px;justify-content:center;margin-top:26px}
    .sc-dots .sc-dot{width:9px;height:9px;border-radius:50%;border:none;background:rgba(20,24,40,.18);cursor:pointer;padding:0;transition:.25s}
    .sc-dots .sc-dot.on{background:#00b3e6;width:26px;border-radius:5px}
    /* ── Showcase 설명 패널 (우측 순차 등장) ── */
    #showcase{padding:60px 0}
    /* 첫 섹션 — 고정 헤더(68px) 아래로 여백 확보 */
    #showcase-sv{padding-top:128px;border-top:none}
    #showcase .wrap,#showcase-sv .wrap{max-width:1560px;padding:0 20px}
    .sc-layout{display:flex;gap:40px;align-items:center}
    .sc-layout .sc-stage{flex:1;min-width:0}
    .sc-desc{width:clamp(330px,28vw,430px);flex-shrink:0}
    .sc-desc .sc-eng{font-size:.92rem;letter-spacing:.14em;font-weight:800;color:var(--brand1);margin:0 0 12px}
    /* 제목은 항상 한 줄 — 폭에 맞춰 크기 자동 축소 */
    .sc-desc .sc-title{font-size:clamp(1.55rem,1.35vw + .6rem,2.05rem);font-weight:800;letter-spacing:-.04em;line-height:1.25;margin:0 0 16px;color:var(--text);white-space:nowrap;display:inline-block}
    .sc-desc .sc-lead{font-size:.98rem;line-height:1.65;color:var(--text-sub);margin:0 0 26px}
    .sc-feats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
    .sc-feats .feat{display:block;background:var(--bg-soft);border:1px solid var(--line);border-radius:14px;padding:17px 22px}
    .sc-feats .feat b{display:block;font-size:1.02rem;font-weight:700;color:var(--text);margin-bottom:5px}
    .sc-feats .feat span{display:block;font-size:.88rem;line-height:1.55;color:var(--text-sub)}
    .sc-desc .sc-eng,.sc-desc .sc-title,.sc-desc .sc-lead{opacity:0;transform:translateX(38px);transition:opacity .65s cubic-bezier(.16,1,.3,1),transform .65s cubic-bezier(.16,1,.3,1)}
    .sc-feats .feat{opacity:0;transform:translateX(46px);transition:opacity .65s cubic-bezier(.16,1,.3,1),transform .65s cubic-bezier(.16,1,.3,1)}
    .sc-desc.in .sc-eng,.sc-desc.in .sc-title,.sc-desc.in .sc-lead,.sc-desc.in .feat{opacity:1;transform:none}
    .sc-desc.in .sc-title{transition-delay:.08s}
    .sc-desc.in .sc-lead{transition-delay:.16s}
    .sc-desc.in .feat:nth-child(1){transition-delay:.26s}
    .sc-desc.in .feat:nth-child(2){transition-delay:.40s}
    .sc-desc.in .feat:nth-child(3){transition-delay:.54s}
    .sc-desc.in .feat:nth-child(4){transition-delay:.68s}
    .sc-desc.in .feat:nth-child(5){transition-delay:.82s}
    /* 세무 showcase: 정보 왼쪽 + 위에서 아래로 내려오는 등장 */
    .sc-desc-top .sc-eng,.sc-desc-top .sc-title,.sc-desc-top .sc-lead{transform:translateY(-36px)}
    .sc-desc-top .feat{transform:translateY(-46px)}
    .sc-desc-top.in .sc-eng,.sc-desc-top.in .sc-title,.sc-desc-top.in .sc-lead,.sc-desc-top.in .feat{transform:none}
    @media(max-width:980px){.sc-layout{flex-direction:column;gap:40px}.sc-desc,.fl-top .sc-desc{width:100%}}
    /* 좁은 화면에서는 한 줄 고정 해제(넘침 방지) */
    @media(max-width:560px){.sc-desc .sc-title{white-space:normal;font-size:1.6rem}}
    /* ───── Showcase 3 (시크원 마사지 앱 — 실제 임베드) ───── */
    #showcase-seek{background:#fff}
    .sk-wrap{display:flex;justify-content:center;align-items:center;gap:44px;flex-wrap:wrap}
    /* 그리드형: 좌 2/3 목업 여러 개 · 우 1/3 설명 */
    .sk-grid{display:grid;grid-template-columns:2fr 1fr;gap:52px;align-items:center}
    .sk-grid .sk-stage{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:18px}
    .sk-grid .sk-phone{width:198px;border-radius:16px;box-shadow:0 14px 34px rgba(20,24,40,.13)}
    .sk-row + .sk-row{margin-top:70px}
    .sk-grid.rev{grid-template-columns:1fr 2fr}
    #showcase-jogun{background:#f5f7fa}
    @media(max-width:980px){.sk-grid,.sk-grid.rev{grid-template-columns:1fr;gap:36px}.sk-grid .sk-phone{width:176px}.sk-grid.rev .sc-desc{order:2}.sk-row + .sk-row{margin-top:48px}}
    .sk-phone{position:relative;width:390px;max-width:90vw;aspect-ratio:390/844;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 18px 44px rgba(20,24,40,.13);overflow:hidden}
    .sk-statusbar{display:none}
    .sk-time{font-weight:700;font-size:15px;color:#0a0a0a;letter-spacing:.02em}
    .sk-sysicons{display:flex;align-items:center;gap:7px}
    .sk-sysicons svg{display:block}
    .sk-island{display:none}
    .sk-phone .sk-screen{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;object-fit:cover;object-position:top;background:#fff;display:block;transition:opacity .5s ease}
    .sk-phone .sk-screen.fade{opacity:0}
    @media(max-width:680px){.sk-wrap{gap:24px}.sk-phone{width:min(360px,92vw);border-radius:18px}}
    /* ───── Showcase 3b (매장 게시판 SaaS — 좌 PC · 우 사용자/관리자) ───── */
    #showcase-seeklist{background:#fff}
    #showcase-seeklist .wrap{max-width:1720px;padding:0 20px}
    .sl-wrap{display:flex;gap:58px;justify-content:center;align-items:center;flex-wrap:wrap}
    .sl-wrap .browser{flex:1;min-width:520px;max-width:1180px}
    .sl-screen{aspect-ratio:1440/1050}
    .sl-phones{display:flex;gap:34px;flex-shrink:0}
    .sl-ph{display:flex;flex-direction:column;align-items:center;gap:16px}
    /* 폰 베젤 없이 화면만 — 얇은 테두리 + 라운드 */
    .sl-shot{width:232px;border-radius:20px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:0 16px 38px rgba(20,24,40,.12)}
    .sl-shot img{display:block;width:100%;height:auto}
    .sl-ph .lb{font-size:1rem;font-weight:700;color:var(--text-sub);text-align:center;line-height:1.4}
    @media(max-width:980px){.sl-wrap{gap:44px}.sl-wrap .browser{flex:1 1 100%;min-width:0}.sl-shot{width:200px}}
    #showcase-homepro{background:#fff}
    #showcase-doum{background:#f5f7fa}
    #showcase-doum .wrap{max-width:1560px;padding:0 20px}
    .dm-admin{margin-top:78px}
    /* ───── Showcase 3e (FLAVO 3D 프린터) ───── */
    #showcase-flavo{background:#fff}
    #showcase-flavo .wrap{max-width:1560px;padding:0 20px}
    .fl-top{display:flex;gap:46px;align-items:center;justify-content:center;flex-wrap:wrap}
    .fl-photo{flex:0 0 auto;width:min(400px,86vw);border-radius:18px;overflow:hidden;box-shadow:0 22px 52px rgba(20,24,40,.18)}
    .fl-photo img{display:block;width:100%;height:auto}
    .fl-top .sc-desc{width:clamp(390px,37vw,540px);max-width:100%}
    .fl-screens{display:flex;gap:40px;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:74px}
    .fl-pad{flex:1;min-width:460px;max-width:960px;display:flex;flex-direction:column;align-items:center;gap:15px}
    .fl-pad img{display:block;width:100%;height:auto;border-radius:16px;border:1px solid var(--line);box-shadow:0 20px 46px rgba(20,24,40,.16)}
    .fl-phones{display:flex;gap:26px;flex-shrink:0}
    .fl-ph{display:flex;flex-direction:column;align-items:center;gap:15px}
    .fl-ph .sl-shot{width:212px}
    .fl-lb{font-size:1rem;font-weight:700;color:var(--text-sub)}
    /* 태블릿 출력 화면 — 실제 UI 재현 시연 (숫자·온도가 실시간으로 움직임) */
    .fl-tabmock{width:100%;aspect-ratio:1600/862;background:#000;border-radius:16px;border:1px solid var(--line);box-shadow:0 20px 46px rgba(20,24,40,.16);overflow:hidden;position:relative;container-type:inline-size;user-select:none}
    .ftm-head{position:absolute;top:2.4cqw;left:0;right:0;text-align:center;color:#fff}
    .ftm-head b{display:block;font-size:1.45cqw;font-weight:800;letter-spacing:.28em}
    .ftm-head span{display:block;margin-top:.5cqw;font-size:1.05cqw;color:#b9b9b9;letter-spacing:.04em}
    .ftm-home{position:absolute;top:2.3cqw;right:3.9cqw;display:flex;align-items:center;gap:.7cqw;border:1px solid #3a3a3a;border-radius:.9cqw;padding:.95cqw 1.9cqw;color:#fff;font-size:1.15cqw;font-weight:700;letter-spacing:.14em}
    .ftm-home svg{width:1.3cqw;height:1.3cqw}
    .ftm-panel{position:absolute;left:2.1cqw;top:7.2cqw;width:54.1cqw;height:40.2cqw;background:#1f1f1f;border-radius:1cqw;display:flex;align-items:center;justify-content:center;overflow:hidden}
    .fl-pad .fl-tabmock .ftm-model{width:26cqw;height:auto;border:none;border-radius:0;box-shadow:none;animation:ftmSpin 2.4s ease-in-out infinite alternate;filter:drop-shadow(0 1.2cqw 2cqw rgba(0,0,0,.45))}
    @keyframes ftmSpin{0%{transform:perspective(60cqw) rotateY(-32deg) rotateX(4deg) translateY(.6cqw)}50%{transform:perspective(60cqw) rotateY(0deg) rotateX(-3deg) translateY(-.8cqw)}100%{transform:perspective(60cqw) rotateY(32deg) rotateX(4deg) translateY(.6cqw)}}
    .ftm-pct{position:absolute;top:8.4cqw;right:3.9cqw;color:#f28a3d;text-align:right;font-weight:800}
    .ftm-pct b{font-size:4.6cqw;line-height:1;font-variant-numeric:tabular-nums}
    .ftm-pct span{font-size:1.15cqw;margin-left:.5cqw;font-weight:700}
    .ftm-grid{position:absolute;left:58.8cqw;right:3.9cqw;top:15.4cqw;height:32cqw;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr 1fr;gap:1.1cqw}
    .ftm-card{background:#141414;border:1px solid #262626;border-radius:.9cqw;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9cqw}
    .ftm-card em{font-style:normal;font-size:1.05cqw;font-weight:700;letter-spacing:.18em;color:#8a8a8a}
    .ftm-card b{font-size:2.2cqw;line-height:1;color:#fff;font-weight:800;font-variant-numeric:tabular-nums}
    .ftm-card b small{font-size:1.05cqw;color:#9a9a9a;font-weight:700;margin-left:.4cqw}
    .ftm-btns{position:absolute;bottom:1.5cqw;left:0;right:0;display:flex;justify-content:center;gap:1.6cqw}
    .ftm-btn{display:flex;align-items:center;justify-content:center;gap:.8cqw;height:3.4cqw;padding:0 3.4cqw;border-radius:2cqw;font-size:1.25cqw;font-weight:800}
    .ftm-btn i{display:block}
    .ftm-btn.stop{border:1px solid #e0442f;color:#ff6b52}
    .ftm-btn.stop i{width:.95cqw;height:.95cqw;background:#e0442f;border-radius:.15cqw}
    .ftm-btn.pause{border:1px solid #6e5b26;color:#c8a544}
    .ftm-btn.pause i{width:.9cqw;height:1cqw;border-left:.28cqw solid #c8a544;border-right:.28cqw solid #c8a544}
    .ftm-btn.start{background:#f28a3d;color:#fff}
    .ftm-btn.start i{width:0;height:0;border-left:.9cqw solid #fff;border-top:.6cqw solid transparent;border-bottom:.6cqw solid transparent}
    .fl-report{max-width:1000px;margin:80px auto 0;background:var(--bg-soft);border:1px solid var(--line);border-radius:20px;padding:40px 42px}
    .fl-report h3{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;margin-bottom:14px;color:var(--text)}
    .fl-report-lead{font-size:1.02rem;line-height:1.7;color:var(--text-sub);margin-bottom:30px}
    .fl-report-lead b{color:var(--text)}
    .fl-timeline{list-style:none;margin:0 0 30px;padding:0;display:flex;flex-direction:column;gap:2px}
    .fl-timeline li{display:grid;grid-template-columns:120px 1fr;gap:6px 18px;padding:16px 0;border-top:1px solid var(--line);align-items:baseline}
    .fl-timeline li:first-child{border-top:none}
    .fl-timeline .d{font-size:.94rem;font-weight:700;color:var(--text-mute);grid-row:span 2}
    .fl-timeline b{font-size:1.06rem;font-weight:700;color:var(--text)}
    .fl-timeline .t{font-size:.96rem;color:var(--text-sub);grid-column:2}
    .fl-case{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px 26px}
    .fl-case-h{font-size:1rem;font-weight:700;color:var(--text);margin-bottom:12px}
    .fl-case-b{font-size:.98rem;line-height:1.75;color:var(--text-sub)}
    .fl-case-b b{color:var(--text);font-weight:700;margin-right:6px}
    @media(max-width:980px){.fl-top{gap:34px}.fl-pad{min-width:0;flex:1 1 100%}.fl-ph .sl-shot{width:180px}.fl-report{padding:30px 24px}.fl-timeline li{grid-template-columns:1fr}.fl-timeline .d{grid-row:auto}.fl-timeline .t{grid-column:1}}
    #showcase-vomfass{background:#f5f7fa}
    #showcase-vomfass .wrap{max-width:1720px;padding:0 20px}
    .vf-wrap{display:flex;gap:30px;justify-content:center;flex-wrap:wrap;align-items:flex-start}
    .vf-wrap .browser{flex:1;min-width:340px;max-width:840px}
    .sk-land{max-width:1000px;margin:0 auto 64px}
    .sk-land-screen{aspect-ratio:1512/900}
    .sk-land-screen .sc-main{object-position:center}
    #showcase-kcct{background:#fff}
    #showcase-kcct .wrap{max-width:1720px;padding:0 20px}
    /* ── 이음 랜딩 (4장 그리드) ── */
    #showcase-ieum{background:#fff}
    #showcase-ieum .wrap{max-width:1180px}
    .ieum-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
    .ieum-shot{border-radius:16px;overflow:hidden;background:#0b0d12;box-shadow:0 18px 44px rgba(20,24,40,.16),0 0 0 1px rgba(20,24,40,.06)}
    .ieum-shot img{display:block;width:100%;height:auto}
    @media(max-width:820px){.ieum-grid{grid-template-columns:1fr;gap:16px}}
    /* ── 이음부동산 (앱스토어 스샷 4장 row) ── */
    #showcase-ieumre{background:#f5f7fa}
    #showcase-ieumre .wrap{max-width:1180px}
    .ire-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
    .ire-shot{border-radius:20px;overflow:hidden;box-shadow:0 16px 40px rgba(20,24,40,.14)}
    .ire-shot img{display:block;width:100%;height:auto}
    @media(max-width:820px){.ire-grid{grid-template-columns:repeat(2,1fr);gap:14px}}
    @media(max-width:480px){.ire-grid{grid-template-columns:1fr}}

    /* ───── 검수 (실제 QA 화면) ───── */
    /* 검수 섹션 다크 — 하단부(검수→인사말→후기) 묵직하게 */
    .qa-sec{background:#111726;padding:92px 0 100px}
    .qa-sec .sec-tag{color:#7fb2ff}
    .qa-sec .sec-title{color:#fff}
    .qa-sec .sec-title::after{background:#7fb2ff}
    .qa-sec .sec-desc{color:rgba(255,255,255,.68)}
    .qa-sec .qa-cap{color:rgba(255,255,255,.66)}
    .qa-sec .qa-cap b{color:#fff}
    .qa-sec .qa-chip{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.13)}
    .qa-sec .qa-chip b{color:rgba(255,255,255,.92)}
    .qa-sec .qa-chip span{color:#6fd8a0}
    .qa-sec .qa-chip.on{background:#fff;border-color:#fff}
    .qa-sec .qa-chip.on b{color:#16181d}
    .qa-sec .qa-chip.on span{color:#1f7a4a}
    .qa-shot{max-width:1180px;margin:0 auto}
    .qa-shot img{display:block;width:100%;height:auto}
    .qa-chips{max-width:1180px;margin:0 auto 26px;display:flex;flex-wrap:wrap;gap:10px}
    .qa-chip{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:11px 18px;border-radius:12px;
      background:#fff;border:1px solid var(--line);cursor:default;text-align:left;transition:background .25s,color .25s,transform .18s,border-color .25s}
    .qa-chip b{font-size:.98rem;font-weight:700;color:var(--text);transition:color .25s}
    .qa-chip span{font-size:.86rem;font-weight:600;color:#2f8f4e;transition:color .25s}
    .qa-chip.on{background:#16181d;border-color:#16181d}
    .qa-chip.on b{color:#fff}
    .qa-chip.on span{color:rgba(255,255,255,.72)}
    .qa-chip.press{transform:scale(.96)}
    @media(max-width:680px){.qa-chips{gap:8px}.qa-chip{padding:9px 14px}.qa-chip b{font-size:.92rem}.qa-chip span{font-size:.8rem}}
    .qa-cap{max-width:1180px;margin:20px auto 0;text-align:center;font-size:1rem;color:var(--text-sub)}
    .qa-cap b{color:var(--text);font-weight:700}
    .qa-shot + .qa-cap + .qa-shot{margin-top:70px}
    /* 표가 아래로 이어진다는 느낌만 남기고 부드럽게 끊기 */
    .qa-fade{-webkit-mask-image:linear-gradient(180deg,#000 82%,transparent 100%);mask-image:linear-gradient(180deg,#000 82%,transparent 100%)}

    /* ───── Reviews ───── */
    .rv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
    .rv-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px 28px;display:flex;flex-direction:column;transition:.25s}
    .rv-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
    .rv-top{display:flex;align-items:center;gap:12px;margin-bottom:16px}
    .rv-avatar{width:46px;height:46px;border-radius:50%;background:var(--grad);display:grid;place-items:center;color:#fff;font-weight:800;flex-shrink:0}
    .rv-name{font-weight:800;font-size:1rem}
    .rv-cat{font-size:.82rem;color:var(--text-mute)}
    .rv-stars{margin-left:auto;color:#ffb020;font-weight:800;font-size:.92rem}
    .rv-body{color:var(--text-sub);font-size:.96rem;flex:1}
    .rv-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
    .rv-tags span{font-size:.78rem;font-weight:600;color:var(--text-sub);background:var(--bg-soft);padding:5px 11px;border-radius:7px}
    .rv-badge{display:inline-block;font-size:.72rem;font-weight:700;color:#22a06b;background:rgba(34,160,107,.1);padding:3px 9px;border-radius:6px;margin-top:4px}
    /* 후기 섹션 다크 — 흰 카드가 떠 보이게 */
    .rv-sec{background:#141821}
    .rv-sec .sec-tag{color:#7fb2ff}
    .rv-sec .sec-title{color:#fff}
    .rv-sec .sec-title::after{background:#7fb2ff}
    .rv-sec .sec-desc{color:rgba(255,255,255,.66)}
    .rv-sec .sec-desc b{color:#fff}

    /* ───── Contact / CTA ───── */
    .contact{background:var(--bg-soft);color:var(--text);position:relative;overflow:hidden}
    /* 개발자 메시지 (후기 앞) */
    .msg-sec{background:var(--bg-soft);padding:74px 0}
    .msg-card{max-width:860px;margin:0 auto;background:#14161d;color:#fff;border-radius:24px;padding:52px 56px;box-shadow:0 30px 70px rgba(16,20,32,.30)}
    .msg-hi{font-size:1.62rem;font-weight:800;letter-spacing:-.03em;line-height:1.4;margin-bottom:26px}
    .msg-p{font-size:1.08rem;line-height:1.85;color:rgba(255,255,255,.76)}
    .msg-p + .msg-p{margin-top:18px}
    .msg-p b{color:#fff;font-weight:700}
    .msg-sign{margin-top:30px;padding-top:22px;border-top:1px solid rgba(255,255,255,.14);font-size:1rem;font-weight:700;color:rgba(255,255,255,.6)}
    @media(max-width:680px){.msg-sec{padding:52px 0}.msg-card{padding:32px 24px;border-radius:20px}.msg-hi{font-size:1.3rem}.msg-p{font-size:1rem}}
    .contact::before{content:"";position:absolute;top:-30%;right:-10%;width:600px;height:600px;border-radius:50%;background:var(--grad);opacity:.09;filter:blur(80px)}
    .contact .sec-title{color:var(--text)}
    .contact .sec-desc{color:var(--text-sub)}
    .ct-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px;position:relative}
    .ct-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:32px 28px;transition:.25s;box-shadow:var(--shadow-sm)}
    .ct-card:hover{transform:translateY(-6px);border-color:#cfd5e0;box-shadow:var(--shadow)}
    .ct-card .ic{margin-bottom:14px;line-height:0}
    .ct-card .ic svg{display:block}
    .ct-card h3{font-size:1.25rem;font-weight:800;margin-bottom:8px}
    .ct-card p{color:var(--text-sub);font-size:.95rem;margin-bottom:16px}
    .ct-card .go{font-weight:700;color:var(--accent)}
    .ct-foot{text-align:center;margin-top:48px;position:relative}
    .ct-foot .btn-primary{font-size:1.1rem;padding:17px 40px}
    .ct-note{color:var(--text-mute);font-size:.92rem;margin-top:16px}

    /* ───── Footer ───── */
    footer{background:#eef1f6;color:var(--text-sub);padding:60px 0 40px;border-top:1px solid var(--line)}
    .ft-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:30px;padding-bottom:34px;border-bottom:1px solid var(--line)}
    .ft-brand{display:flex;align-items:center;gap:10px;font-size:1.4rem;font-weight:800;color:var(--text);margin-bottom:14px}
    .ft-brand .mark{width:32px;height:32px;border-radius:9px;background:var(--grad);display:grid;place-items:center;color:#fff;font-weight:900}
    .ft-desc{font-size:.95rem;max-width:340px;color:var(--text-mute)}
    .ft-info{display:grid;grid-template-columns:auto auto;gap:8px 28px;font-size:.92rem}
    .ft-info dt{color:var(--text-mute);font-weight:600}
    .ft-info dd{color:var(--text-sub)}
    .ph{color:#c08a00}
    .ft-bottom{padding-top:26px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.86rem;color:var(--text-mute)}
    .ft-links{display:flex;gap:20px}
    .ft-links a:hover{color:var(--text)}

    /* ───── Reveal anim ───── */
    .reveal{opacity:0;transform:translateY(26px);transition:.7s cubic-bezier(.16,1,.3,1)}
    .reveal.in{opacity:1;transform:none}

    /* ───── Responsive ───── */
    @media(max-width:980px){
      .phone{display:none}
      .rv-grid,.ct-cards{grid-template-columns:1fr}
      .pf-grid{grid-template-columns:repeat(3,1fr)}
      .gnb{gap:18px}
      .gnb a{font-size:.92rem}
      .tb-msg{font-size:.86rem}
    }
    @media(max-width:820px){
      .gnb{display:none}
      .burger{display:flex}
      .gnb.open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:#fff;padding:18px 24px;gap:18px;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
      .gnb.open a{font-size:1.05rem}
    }
    @media(max-width:680px){
      .tb-msg{display:none}
      .topbar .wrap{justify-content:center;height:38px}
      .tb-contact{font-size:.95rem}
      .tb-contact .tb-mail,.tb-contact .tb-sep{display:none}
      #showcase-sv{padding-top:132px}
      section.block{padding:74px 0}
      .sec-title{font-size:2.1rem;letter-spacing:-.045em}
      .pf-grid{grid-template-columns:repeat(2,1fr)}
      .nav-cta{display:none}
      .qa-sec{padding:68px 0 74px}
    }

    /* ───── 무료 견적/상담 전화번호 팝업 ───── */
    .qpop{position:fixed;inset:0;z-index:6000;display:flex;align-items:center;justify-content:center;padding:20px;
      background:rgba(15,18,26,.5);backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease}
    .qpop.open{opacity:1;visibility:visible}
    .qpop-card{position:relative;width:100%;max-width:min(388px,calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:24px;
      padding:38px 32px 30px;box-shadow:0 30px 80px rgba(20,24,40,.28);text-align:center;
      transform:translateY(14px) scale(.96);transition:transform .3s cubic-bezier(.2,.8,.25,1)}
    .qpop.open .qpop-card{transform:translateY(0) scale(1)}
    .qpop-x{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);
      background:#fff;display:grid;place-items:center;cursor:pointer;color:var(--text-sub);transition:.2s}
    .qpop-x:hover{background:var(--bg-soft);color:var(--text)}
    .qpop-x svg{width:16px;height:16px;stroke:currentColor;stroke-width:2.2;fill:none}
    .qpop-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;border-radius:999px;background:var(--bg-soft);
      border:1px solid var(--line);font-size:.8rem;font-weight:700;color:var(--text-sub);margin-bottom:18px}
    .qpop-badge .dot{width:7px;height:7px;border-radius:50%;background:#22a06b;box-shadow:0 0 0 4px rgba(34,160,107,.16)}
    .qpop-title{font-size:1.4rem;font-weight:800;letter-spacing:-.03em;color:var(--text);margin-bottom:8px}
    .qpop-sub{font-size:.94rem;color:var(--text-sub);margin-bottom:24px;line-height:1.5}
    .qpop-sub b{color:var(--text);font-weight:700}
    .qpop-phone{display:flex;align-items:center;justify-content:center;gap:11px;text-decoration:none;white-space:nowrap;
      font-size:clamp(1.35rem,6vw,2rem);font-weight:800;letter-spacing:-.02em;color:var(--text);margin-bottom:22px}
    .qpop-phone svg{width:24px;height:24px;stroke:var(--text);stroke-width:2;fill:none;flex-shrink:0}
    .qpop-actions{display:flex;gap:10px;margin-bottom:20px}
    .qpop-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:14px 10px;border-radius:13px;
      font-weight:800;font-size:.98rem;cursor:pointer;transition:.2s;border:1px solid transparent;text-decoration:none}
    .qpop-btn.primary{background:var(--text);color:#fff}
    .qpop-btn.primary:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(20,24,40,.24)}
    .qpop-btn.ghost{background:#fff;color:var(--text);border-color:var(--line)}
    .qpop-btn.ghost:hover{border-color:#cfd5e0;background:var(--bg-soft)}
    .qpop-mail{display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap;
      padding-top:18px;border-top:1px solid var(--line);font-size:.92rem;color:var(--text-sub)}
    .qpop-mail a{color:var(--text);font-weight:700;text-decoration:none}
    .qpop-mail a:hover{text-decoration:underline}
    .qpop-copy{border:none;background:none;color:var(--text-mute);font-size:.86rem;font-weight:700;cursor:pointer;padding:2px 4px}
    .qpop-copy:hover{color:var(--text)}
    @media(max-width:480px){.qpop{padding:16px}.qpop-card{padding:34px 22px 26px}}

    /* ───── 프로젝트 상세 페이지 ───── */
    .pg-hero{padding:170px 0 46px;background:var(--bg-soft);border-bottom:1px solid var(--line)}
    .pg-crumb{font-size:.95rem;color:var(--text-mute);font-weight:600;margin-bottom:14px}
    .pg-crumb a{color:var(--text-sub)}
    .pg-crumb a:hover{color:var(--text)}
    .pg-hero h1{font-size:2.4rem;line-height:1.28;letter-spacing:-.02em;font-weight:800;margin-bottom:16px}
    .pg-hero .pg-lead{font-size:1.16rem;color:var(--text-sub);line-height:1.72;max-width:840px}
    .pg-meta{display:flex;flex-wrap:wrap;gap:10px 32px;margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
    .pg-meta div{font-size:1rem}
    .pg-meta em{display:block;font-style:normal;color:var(--text-mute);font-weight:600;font-size:.94rem;margin-bottom:3px}
    .pg-meta b{font-weight:700;color:var(--text)}

    .pg-body{padding:64px 0}
    .pg-body h2{font-size:1.7rem;font-weight:800;letter-spacing:-.02em;margin-bottom:18px}
    .pg-body h3{font-size:1.24rem;font-weight:700;margin:34px 0 12px}
    .pg-body p{font-size:1.06rem;color:var(--text-sub);line-height:1.85;margin-bottom:16px;max-width:880px}
    .pg-body ul{list-style:none;max-width:880px;margin-bottom:16px}
    .pg-body ul li{font-size:1.06rem;color:var(--text-sub);line-height:1.8;padding-left:18px;position:relative;margin-bottom:9px}
    .pg-body ul li:before{content:'';position:absolute;left:2px;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--text-mute)}
    .pg-body ul li b{color:var(--text);font-weight:700}

    .pg-rel{padding:56px 0 68px;background:var(--bg-soft);border-top:1px solid var(--line)}
    .pg-rel h2{font-size:1.44rem;font-weight:800;margin-bottom:22px}
    .pg-rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
    .pg-rel-grid a{display:block;background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px;transition:.2s}
    .pg-rel-grid a:hover{border-color:#c8cede;transform:translateY(-2px);box-shadow:var(--shadow-sm)}
    .pg-rel-grid .t{font-size:1.04rem;font-weight:700;margin-bottom:6px;color:var(--text)}
    .pg-rel-grid .d{font-size:.97rem;color:var(--text-mute);line-height:1.6}

    .pg-cta{padding:64px 0;text-align:center;background:#17356b;color:#fff}
    .pg-cta h2{font-size:1.86rem;font-weight:800;letter-spacing:-.02em;margin-bottom:14px;color:#fff}
    .pg-cta p{font-size:1.08rem;color:#c3cee4;margin-bottom:28px;line-height:1.75}
    .pg-cta .btn{display:inline-block;background:#fff;color:#17356b;font-weight:800;font-size:1.06rem;padding:16px 38px;border-radius:12px;transition:.2s}
    .pg-cta .btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.22)}

    @media(max-width:900px){
      .pg-rel-grid{grid-template-columns:1fr}
      .pg-hero{padding:150px 0 38px}
      .pg-hero h1{font-size:1.86rem}
      .pg-hero .pg-lead{font-size:1.06rem}
      .pg-body{padding:46px 0}
      .pg-body h2{font-size:1.44rem}
    }

    /* ───── 메인 → 프로젝트 상세 링크 ───── */
    .sc-more-wrap{margin-top:34px;text-align:center}
    .sc-more{display:inline-flex;align-items:center;gap:8px;font-size:1.02rem;font-weight:700;color:#17356b;
      border:1px solid #cdd6e6;background:#fff;border-radius:999px;padding:13px 26px;transition:.2s}
    .sc-more:after{content:'→';font-size:1.05rem;transition:transform .2s}
    .sc-more:hover{border-color:#17356b;box-shadow:var(--shadow-sm)}
    .sc-more:hover:after{transform:translateX(3px)}

    /* ───── 서비스 페이지 FAQ ───── */
    .pg-faq{padding:56px 0 64px;border-top:1px solid var(--line)}
    .pg-faq h2{font-size:1.7rem;font-weight:800;letter-spacing:-.02em;margin-bottom:24px}
    .fq{border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin-bottom:12px;background:var(--bg-soft)}
    .fq-q{font-size:1.08rem;font-weight:700;color:var(--text);margin-bottom:9px;line-height:1.55}
    .fq-a{font-size:1.03rem;color:var(--text-sub);line-height:1.82}
    @media(max-width:900px){.pg-faq{padding:44px 0 50px}.pg-faq h2{font-size:1.44rem}.fq{padding:18px 19px}}

    /* ───── 메인: 개발 분야 링크 ───── */
    .sv-links{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:34px}
    .sv-links a{display:block;background:#fff;border:1px solid var(--line);
      border-radius:14px;padding:20px 22px;transition:.2s}
    .sv-links a:hover{border-color:#17356b;transform:translateY(-2px);box-shadow:var(--shadow-sm)}
    .sv-links b{display:block;font-size:1.08rem;font-weight:700;color:#17356b;margin-bottom:6px}
    .sv-links span{display:block;font-size:.98rem;color:var(--text-sub);line-height:1.6}
    @media(max-width:900px){.sv-links{grid-template-columns:1fr;gap:10px;margin-bottom:26px}}