:root{--ink:#0a0b0e;--cream:#f2eee5;--paper:#f7f6f2;--gold:#bca77c;--line:#d9d5cb;--muted:#77736c}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"Noto Sans KR",sans-serif}a{text-decoration:none;color:inherit}header{height:76px;padding:0 5vw;display:flex;align-items:center;gap:44px;position:fixed;z-index:50;top:0;width:100%;background:rgba(247,246,242,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(10,11,14,.08)}.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.13em}.brand img{width:36px;height:36px;border-radius:50%;object-fit:cover}header nav{display:flex;gap:30px;color:#5e5c58;font-size:14px}header nav a:hover{color:#000}.topcta{margin-left:auto;background:#0b0c0e;color:#fff;padding:13px 20px;border-radius:999px;font-size:13px;font-weight:800}.hero{height:100vh;min-height:720px;position:relative;color:#fff;display:flex;align-items:center;overflow:hidden}.hero video{position:absolute;width:100%;height:100%;object-fit:cover}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,6,8,.8) 0%,rgba(5,6,8,.48) 48%,rgba(5,6,8,.12) 100%),linear-gradient(0deg,rgba(5,6,8,.35),transparent 55%)}.heroCopy{position:relative;z-index:2;width:min(1200px,88vw);margin:auto;padding-top:60px}.eyebrow{font:700 11px monospace;letter-spacing:.22em;color:#d7c69f}.eyebrow.dark{color:#8e7850}.hero h1{font-size:clamp(54px,7.3vw,112px);line-height:.93;letter-spacing:-.065em;margin:22px 0;max-width:1100px}.hero h1 em{font-style:normal;color:var(--cream)}.heroCopy>p:not(.eyebrow){font-size:18px;line-height:1.75;color:#e5e2dc}.actions{display:flex;gap:12px;margin-top:34px}.primary,.ghost{padding:16px 23px;border-radius:999px;font-weight:800;font-size:14px}.primary{background:#f4f0e7;color:#0b0c0e}.ghost{border:1px solid #ffffff70}.scroll{position:absolute;z-index:2;bottom:34px;right:5vw;font:11px monospace;letter-spacing:.15em;color:#ddd}.intro,.refs,.process{padding:14vh 7vw}.intro h2,.refHead h2,.process h2,.contact h2{font-size:clamp(45px,6vw,82px);line-height:1;letter-spacing:-.055em;margin:22px 0}.sub{max-width:680px;color:var(--muted);font-size:18px;line-height:1.8}.features{margin-top:70px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.features article{padding:45px 36px;border-right:1px solid var(--line)}.features article:last-child{border:0}.features b{font:700 12px monospace;color:#927e58}.features h3{font-size:22px;letter-spacing:.03em;margin-top:40px}.features p{color:var(--muted);line-height:1.75}.offer{background:#0a0b0e;color:#f4f1ea;padding:12vh 7vw;display:grid;grid-template-columns:1.1fr .9fr;gap:10vw}.offer h2{font-size:clamp(42px,5.5vw,76px);line-height:1;letter-spacing:-.05em}.offer ul{list-style:none;padding:0;margin:0}.offer li{padding:20px 0;border-bottom:1px solid #ffffff20;color:#d8d4cc}.offer li:before{content:"↗";color:#d7c69f;margin-right:14px}.refHead{display:flex;justify-content:space-between;align-items:end;gap:50px}.refHead p{max-width:480px;color:var(--muted);line-height:1.7}.refgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:55px}.refgrid>a{transition:.3s}.refgrid>a:hover{transform:translateY(-8px)}.mock{height:360px;padding:30px;display:flex;flex-direction:column;justify-content:end;color:#fff;position:relative;overflow:hidden;background-size:cover}.mock:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#000b,transparent)}.mock span,.mock strong{position:relative;z-index:2}.mock span{font:11px monospace;letter-spacing:.18em}.mock strong{font-size:30px;line-height:1.05;margin-top:10px}.warm{background:linear-gradient(135deg,#8c7c68,#d9cbb8)}.pool{background:linear-gradient(135deg,#2d4147,#9fb4b2)}.night{background:linear-gradient(135deg,#0d1016,#4e5662)}.refgrid h3{font-size:20px;margin-bottom:5px}.refgrid p{color:var(--muted);margin-top:0}.process{background:#eae6dd}.process ol{list-style:none;padding:0;margin:70px 0 0}.process li{display:grid;grid-template-columns:90px 1fr;border-top:1px solid #c7c0b4;padding:30px 0}.process li>span{font:700 13px monospace;color:#8e7850}.process li b{font-size:25px}.process li p{color:#716c64;margin-bottom:0}.faq{background:#0c0d0f;color:#f5f3ee;padding:12vh max(7vw,calc((100vw - 1100px)/2))}.faq>p{text-align:center;color:#aaa}.faq h2{text-align:center;font-size:clamp(46px,5vw,72px);margin:10px 0 65px}.faq h2 em{font-style:normal;color:#c6ad7c}.faq details{border:1px solid #343536;margin:14px 0;background:#141517}.faq summary{list-style:none;padding:30px 34px;display:grid;grid-template-columns:70px 1fr auto;align-items:center;cursor:pointer;font-size:20px}.faq summary::-webkit-details-marker{display:none}.faq summary b{color:#c6ad7c;font-size:28px}.faq summary i{font-style:normal;color:#888;font-size:25px}.faq details>p{padding:0 34px 30px 104px;color:#aaa;line-height:1.7}.contact{padding:13vh 7vw;background:linear-gradient(135deg,#111216,#17191e);color:#f4f1ea;display:grid;grid-template-columns:.9fr 1.1fr;gap:8vw}.contactCopy>p:not(.eyebrow){color:#a8a7a4}.contactCopy>a{display:inline-block;margin-top:20px;color:#d7c69f;font-size:20px}.contact form{background:#f5f2eb;color:#111;padding:42px;border-radius:22px;display:grid;gap:16px}.contact form h3{font-size:27px;margin:0}.contact form>p{color:#777;margin-top:-7px}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.contact label{display:grid;gap:8px;font-size:13px;font-weight:700}.contact input,.contact select,.contact textarea{padding:15px 16px;border:1px solid #d7d1c5;border-radius:10px;background:#fff;font:inherit}.agree{display:flex!important;align-items:center;color:#777;font-weight:400!important}.agree input{width:17px;height:17px}.contact button{border:0;background:#0c0d0f;color:#fff;padding:18px;border-radius:10px;font-weight:900;font-size:15px}.contact small{color:#888;text-align:center}footer{padding:48px 7vw;background:#08090b;color:#aaa;display:flex;justify-content:space-between;align-items:center}.footbrand{display:flex;align-items:center;gap:14px}.footbrand img{width:54px;height:54px;border-radius:50%;object-fit:cover}.footbrand div{display:grid;gap:4px}.footbrand b{color:#fff;letter-spacing:.16em}.footbrand span{font-size:9px;letter-spacing:.2em}@media(max-width:800px){header{height:66px;padding:0 5vw}header nav{display:none}.brand span{font-size:13px}.topcta{padding:11px 15px}.hero{min-height:680px}.hero h1{font-size:51px}.heroCopy>p:not(.eyebrow){font-size:15px}.features,.refgrid,.offer,.contact{grid-template-columns:1fr}.features article{border-right:0;border-bottom:1px solid var(--line)}.offer{gap:40px}.refHead{display:block}.mock{height:280px}.process li{grid-template-columns:55px 1fr}.faq summary{grid-template-columns:50px 1fr auto;padding:25px 18px;font-size:16px}.faq summary b{font-size:22px}.faq details>p{padding:0 18px 25px 68px}.contact form{padding:25px}.two{grid-template-columns:1fr}.actions{flex-wrap:wrap}footer{align-items:flex-start;flex-direction:column;gap:25px}}
/* scroll-scrub walkthrough */
.scrollHero{height:420vh;min-height:0;display:block;padding:0}
.stickyVideo{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;color:#fff}
.stickyVideo video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.scrollHero .heroCopy{position:relative;z-index:3;width:min(1200px,88vw);margin:auto;padding-top:60px;transition:opacity .35s ease,transform .35s ease}
.scrollHero.scrubbed .heroCopy{opacity:.14;transform:translateY(-16px)}
.scrollHero .shade{z-index:1}
.scrollHero .scroll{z-index:3}
.twoRefs{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}
.twoRefs .mock{height:430px}
.mock i{position:relative;z-index:2;font:10px monospace;letter-spacing:.15em;margin-top:18px;color:#eee}
@media(max-width:800px){.scrollHero{height:360vh}.twoRefs{grid-template-columns:1fr}.twoRefs .mock{height:300px}}

.hero{height:100vh;min-height:720px;position:relative}
.hero .stickyVideo{position:absolute;inset:0;height:100%;width:100%}
.heroMainImage{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.videoPortfolio{padding:14vh 7vw;background:#f7f6f2}
.videoHead{display:flex;justify-content:space-between;align-items:end;gap:50px}
.videoHead h2{font-size:clamp(45px,6vw,82px);line-height:1;letter-spacing:-.055em;margin:22px 0}
.videoHead p{max-width:440px;color:var(--muted);line-height:1.7}
.videoGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:52px}
.videoGrid article{background:#0b0c0e;padding:10px 10px 18px;border-radius:18px;overflow:hidden}
.videoGrid video{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:12px;background:#111}
.videoGrid span{display:block;color:#d7c69f;font:700 10px monospace;letter-spacing:.18em;padding:14px 8px 0}
.fixedConsult{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:100;width:min(760px,calc(100% - 30px));display:flex;justify-content:space-between;align-items:center;padding:14px 18px 14px 22px;background:rgba(10,11,14,.94);color:#fff;border:1px solid rgba(215,198,159,.45);border-radius:999px;box-shadow:0 14px 40px rgba(0,0,0,.28);backdrop-filter:blur(18px)}
.fixedConsult span{font-size:13px;color:#d7d3cb}.fixedConsult b{background:#f3efe6;color:#0b0c0e;padding:12px 17px;border-radius:999px;font-size:13px}
body{padding-bottom:88px}
@media(max-width:800px){
.hero{min-height:680px}
.videoHead{display:block}.videoGrid{grid-template-columns:1fr;gap:18px}.videoGrid video{aspect-ratio:16/10}
.fixedConsult{bottom:10px;padding:10px 10px 10px 16px}.fixedConsult span{font-size:11px}.fixedConsult b{font-size:11px;padding:11px 13px}
}

/* 1080p horizontal AI video portfolio */
.videoGrid{grid-template-columns:1fr!important;max-width:1280px;margin:55px auto 0!important;gap:34px!important}
.videoGrid video{display:block;width:100%!important;height:auto!important;aspect-ratio:16/9!important;object-fit:contain!important;background:#050505}
@media(max-width:800px){.videoGrid{gap:20px!important}.videoGrid video{aspect-ratio:16/9!important}}

/* Reference project photos */
.refPhoto{background-position:center;background-size:cover;background-repeat:no-repeat}
.refPhoto1{background-image:url('assets/reference-1.png')}
.refPhoto2{background-image:url('assets/reference-2.png')}
.refPhoto:after{background:linear-gradient(0deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.18) 52%,rgba(0,0,0,.04) 100%)}