:root{--bg:#f7f7f5;--ink:#101116;--muted:#758099;--blue:#1553ff;--line:#dce2eb;--pale:#dcecff}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible{outline:3px solid var(--blue);outline-offset:7px}p,h1,h2,h3{margin:0}img{display:block;width:100%;height:100%;object-fit:cover}.wrap{width:min(1280px,calc(100% - 112px));margin-inline:auto}.skip{position:fixed;top:-100px;left:16px;z-index:10;background:var(--blue);color:white;padding:14px}.skip:focus{top:16px}.header{height:104px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:17px;font-size:19px;font-weight:700;letter-spacing:.075em}.brand-orb{width:29px;height:29px;border-radius:50%;background:radial-gradient(circle at 32% 20%,#ebf7ff 0%,#8bb8ff 27%,#2667f5 58%,#123dc7 87%);box-shadow:inset 1px 1px 5px #ffffff50}.header nav{display:flex;gap:37px;font-size:14px}.header nav a{transition:color .2s}.header nav a:hover{color:var(--blue)}.hero{position:relative;padding-top:64px;padding-bottom:56px}.hero-copy{position:relative;z-index:2}.eyebrow{color:var(--blue);font-size:12px;letter-spacing:.12em;font-weight:500}.hero .eyebrow{letter-spacing:.2em;margin-bottom:18px}.hero h1{font-size:clamp(70px,7.9vw,114px);line-height:.93;letter-spacing:-.06em;font-weight:500;display:flex;align-items:flex-start;width:max-content}.asterisk{color:var(--blue);font-size:.88em;font-weight:400;margin-left:17px;line-height:.75}.year{color:var(--muted);letter-spacing:.28em;font-size:17px;margin-top:12px}.statement{font-size:clamp(24px,2.8vw,39px);letter-spacing:-.045em;line-height:1.5;font-weight:400;margin-top:32px;max-width:900px;word-break:keep-all}.name{font-size:16px;margin-top:33px}.actions{display:flex;align-items:center;gap:30px;margin-top:24px}.button{display:inline-flex;gap:8px;align-items:center;padding:16px 33px;border-radius:99px;color:#fff;background:var(--blue);font-size:14px;transition:transform .2s,background .2s}.button:hover{transform:translateY(-3px);background:#003ae8}.text-link{display:inline-flex;gap:8px;font-size:15px;color:#344264;border-bottom:1px solid #9fb9ef;padding-bottom:8px}.text-link:hover{color:var(--blue)}.hero-bottom{margin-top:66px;display:flex;align-items:center;gap:24px}.rule{height:1px;background:#bfc8d6;flex:1}.hero-bottom p{font-size:10px;color:#65718b;letter-spacing:.16em;display:flex;gap:16px;white-space:nowrap}.projects{padding-top:12px;padding-bottom:29px}.section-heading{margin-bottom:34px}.section-heading h2{font-size:clamp(32px,4.3vw,60px);font-weight:750;letter-spacing:-.055em;display:flex;gap:15px;align-items:center}.section-heading h2 span{font-size:16px;letter-spacing:0;font-weight:400;color:var(--muted);align-self:center}.section-heading>p{font-size:16px;color:var(--muted);margin-top:9px;word-break:keep-all}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.project{overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:4px;transition:box-shadow .25s,transform .25s;background:#ffffff35}.project:hover{box-shadow:0 12px 32px #1b38680c;transform:translateY(-3px)}.feature{grid-column:1/-1;display:grid;grid-template-columns:1.06fr .94fr;min-height:380px}.feature-visual{background:#dcecff;min-height:380px;overflow:hidden}.feature img{transition:transform .6s}.feature:hover img{transform:scale(1.025)}.project-copy{padding:25px 36px 30px;flex:1;display:flex;flex-direction:column;align-items:flex-start}.feature .project-copy{padding:49px 40px;justify-content:center}.project-copy .eyebrow{margin-bottom:18px}.project h3{font-size:clamp(23px,2.4vw,34px);line-height:1.38;letter-spacing:-.045em;font-weight:750;word-break:keep-all}.feature h3{font-size:clamp(24px,2.45vw,35px)}.description{font-size:16px;line-height:1.7;color:var(--muted);margin-top:21px;word-break:keep-all}.project-link{display:inline-flex;gap:8px;color:var(--blue);font-size:14px;padding-bottom:5px;border-bottom:1px solid #a2bcfa;margin-top:24px}.feature .project-link{margin-top:37px}.project:hover .project-link>span{transform:translate(2px,-2px)}.project-link>span{transition:transform .2s}.search-visual{height:280px;position:relative;padding:52px 40px 15px;overflow:hidden}.search-visual>p{font-family:Georgia,'Times New Roman',serif;font-size:57px;letter-spacing:-.055em;line-height:.95;position:relative;z-index:1;color:#165bd5}.search-pages{position:absolute;right:21px;top:44px;width:230px;height:205px;transform:rotate(8deg)}.search-pages span{position:absolute;display:block;width:170px;height:132px;border-radius:6px;background:linear-gradient(115deg,#fafdffcc,#d7e8ff91);box-shadow:0 3px 12px #bbd4fa1a;border:1px solid #fff9;transform:skewY(8deg)}.search-pages span:before{content:'';position:absolute;inset:22px 15px;background:repeating-linear-gradient(#b3caeb70 0 3px,transparent 3px 14px);opacity:.6}.search-pages span:nth-child(1){top:0;right:0;opacity:.5}.search-pages span:nth-child(2){top:39px;right:29px;opacity:.7}.search-pages span:nth-child(3){top:78px;right:56px}.search-pill{display:flex;align-items:center;gap:13px;position:absolute;bottom:32px;right:47px;z-index:2;background:#fff9;box-shadow:0 5px 20px #6388c113;border:1px solid #fff;border-radius:28px;padding:14px 29px;font-size:12px;color:#17254a}.search-icon{width:15px;height:15px;display:inline-block;border:1.5px solid var(--blue);border-radius:50%;position:relative}.search-icon:after{content:'';position:absolute;width:6px;height:1.5px;background:var(--blue);right:-5px;bottom:-2px;transform:rotate(48deg)}.cine-visual{height:280px;background:radial-gradient(ellipse at 90% 100%,#212642,#111624 70%);position:relative;overflow:hidden}.cine-wordmark{position:absolute;left:40px;top:79px;z-index:2;color:#f3f2fa;font-family:Georgia,'Times New Roman',serif;font-size:54px;letter-spacing:-.06em}.cine-wordmark p{font-family:"Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-size:14px;color:#c2c3d5;letter-spacing:.02em;margin-top:9px}.moon{position:absolute;right:53px;top:37px;width:186px;height:186px;border-radius:50%;background:radial-gradient(circle at 36% 22%,#a4b3f0,#626bc0 37%,#3d467f 67%,#a5a7e0 95%);box-shadow:inset 7px 5px 18px #dbe1ff9e,inset -14px -8px 24px #1b204380,0 0 35px #6879c540;opacity:.85}.moon:after{content:'';position:absolute;inset:0;border-radius:50%;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.45' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' opacity='.22' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:screen}.film{position:absolute;width:112%;height:240px;left:-5%;bottom:-76px;z-index:3;opacity:.78}.about{background:#e0eeff;position:relative;overflow:hidden}.about-inner{padding-top:43px;padding-bottom:29px;display:grid;grid-template-columns:39% 1fr;position:relative;align-items:center}.about-intro{border-right:1px solid #aabedb}.about h2{font-size:clamp(38px,4.7vw,64px);letter-spacing:-.06em;font-weight:750;line-height:1.1}.about-link{font-size:12px;color:#647c9f;display:inline-block;margin-top:16px}.about-link:hover{color:var(--blue)}.about-statement{font-size:18px;line-height:1.65;letter-spacing:-.03em;padding-left:57px;position:relative;z-index:1}.about-orb{position:absolute;width:140px;height:140px;right:30px;top:25px;border-radius:50%;background:radial-gradient(circle at 36% 23%,#c3dcff,#87b8fb99 55%,#e7f2ff);filter:blur(9px);opacity:.7}footer{border-top:1px solid #aebed4;display:flex;justify-content:space-between;align-items:center;padding-block:23px 27px;font-size:10px;letter-spacing:.1em;position:relative}footer>div{display:flex;gap:23px}footer a:hover{color:var(--blue)}

@media(min-width:1550px){.hero{padding-top:85px}.hero-bottom{margin-top:90px}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.hero h1{font-size:88px}.statement{font-size:31px;max-width:730px}.feature .project-copy{padding:30px}.feature h3{font-size:27px}.project-copy{padding:26px}.search-visual{padding-left:28px}.cine-wordmark{left:28px;font-size:46px}.search-visual>p{font-size:51px}.moon{right:25px;width:155px;height:155px}.about-statement{padding-left:35px}}
@media(max-width:800px){.header{height:86px}.brand{font-size:16px;gap:11px}.brand-orb{width:24px;height:24px}.header nav{gap:22px;font-size:13px}.hero{padding-top:37px}.hero h1{font-size:clamp(52px,10.5vw,82px)}.statement{font-size:27px;max-width:570px}.hero-copy{z-index:2}.hero-bottom{gap:18px;margin-top:49px}.hero-bottom p{font-size:8px;gap:8px}.feature{min-height:0;grid-template-columns:1fr}.feature-visual{min-height:0;height:auto;aspect-ratio:1.8}.feature .project-copy{padding:28px}.feature h3{font-size:28px}.feature .project-link{margin-top:22px}.search-visual,.cine-visual{height:230px}.search-visual{padding:37px 24px}.search-visual>p{font-size:43px}.search-pages{right:-46px;opacity:.65}.search-pill{right:20px;bottom:15px;padding:12px 19px;font-size:10px}.cine-wordmark{font-size:36px;top:63px;left:24px}.cine-wordmark p{font-size:11px}.moon{width:140px;height:140px;right:5px;top:26px}.project h3{font-size:22px}.about-inner{grid-template-columns:42% 1fr}.about-statement{font-size:15px;padding-left:24px}.about-orb{right:-70px}}
@media(max-width:560px){.wrap{width:calc(100% - 40px)}.header{height:77px}.brand{font-size:13px;gap:8px}.brand-orb{width:21px;height:21px}.header nav{gap:15px;font-size:11px}.hero{padding-top:39px;padding-bottom:33px}.hero .eyebrow{font-size:10px;margin-bottom:16px}.hero h1{font-size:clamp(41px,10.2vw,57px)}.asterisk{margin-left:9px}.year{font-size:12px;margin-top:9px}.statement{font-size:25px;line-height:1.5;margin-top:28px;max-width:100%;position:relative}.desktop-break{display:none}.name{font-size:13px;margin-top:26px}.actions{gap:22px;margin-top:19px}.button{padding:14px 24px;font-size:12px}.text-link{font-size:12px}.hero-bottom{margin-top:37px;gap:13px}.hero-bottom p{font-size:7px;letter-spacing:.06em;gap:6px}.section-heading{margin-bottom:25px}.section-heading h2{font-size:33px;gap:8px}.section-heading h2 span{font-size:11px}.section-heading>p{font-size:12px;margin-top:9px}.project-grid{grid-template-columns:1fr;gap:16px}.feature{grid-column:auto}.feature-visual{aspect-ratio:1.5}.project-copy,.feature .project-copy{padding:25px}.project-copy .eyebrow{font-size:10px;margin-bottom:14px}.project h3,.feature h3{font-size:25px}.description{font-size:13px;margin-top:16px}.project-link{font-size:12px;margin-top:21px}.search-visual{height:255px;padding:35px 27px}.search-visual>p{font-size:53px}.search-pages{right:5px}.search-pill{right:27px;bottom:26px}.cine-visual{height:250px}.cine-wordmark{font-size:44px;top:74px;left:27px}.moon{width:166px;height:166px;right:31px;top:28px}.cine-wordmark p{font-size:12px}.about-inner{display:block;padding-top:34px;padding-bottom:29px}.about-intro{border:0}.about h2{font-size:43px}.about-link{margin-top:12px}.about-statement{padding:0;margin-top:25px;font-size:16px}.about-orb{right:-28px;top:71px;width:126px;height:126px}.projects{padding-bottom:24px}footer{font-size:8px;padding-block:21px;letter-spacing:.05em}footer>div{gap:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.project,.button,.feature img,.project-link>span{transition:none}}

/* Random hero orbs — 2026-09-28 */
.hero { position: relative; overflow: hidden; }
.hero-orbs {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}
.hero-copy, .hero-bottom { position: relative; z-index: 1; }
.hero-orb {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  background: rgba(54, 94, 255, var(--alpha));
  filter: blur(var(--blur));
  transform: translate3d(0, 0, 0);
  animation: hero-orb-drift var(--duration) ease-in-out var(--delay) infinite alternate;
  will-change: transform;
}
@keyframes hero-orb-drift {
  0% { transform: translate3d(calc(var(--dx) * -1), calc(var(--dy) * -1), 0) scale(.92); }
  100% { transform: translate3d(var(--dx), var(--dy), 0) scale(1.08); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-orb { animation: none; }
}

/* Existing portfolio header identity */
.brand { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; }
.brand-orb {
  width: 24px; height: 24px; border-radius: 50%; position: relative;
  background: radial-gradient(circle at 32% 30%, #ffffff 0 9%, #dbeafe 22%, #8fb4ff 54%, #b9b4ff 75%, #ffffff 100%);
  box-shadow: inset 0 0 0 1px rgba(37,99,235,.08);
}
.brand-orb::after {
  content: ""; position: absolute; width: 11px; height: 11px; border-radius: 50%; left: -2px; bottom: -2px;
  background: rgba(219,234,254,.85); box-shadow: 0 0 18px rgba(37,99,235,.22);
}

.brand { letter-spacing: 0; }

/* Content 1: original source rules, isolated from the new layout */
.original-hero { --max:1240px; --ink:#15171b; --muted:#6b7280; --line:#e7ecf5; padding:0; color:var(--ink); }
.original-hero h1 { display:block; width:auto; }
.original-hero {
  min-height: 100svh; display: flex; align-items: center; position: relative; overflow: hidden;
  border-bottom: 1px solid rgba(231,236,245,.7);
}
.original-hero .section-inner { width: 100%; max-width: var(--max); margin: 0 auto; padding: 80px 44px; position: relative; z-index: 2; }
.original-hero .section-inner { min-height: calc(100svh - 64px); display: grid; align-content: center; }
.original-hero .hero-copy { max-width: 820px; }
.original-hero .hero-title { font-size: clamp(48px, 7.1vw, 102px); line-height: .92; margin: 12px 0 24px; letter-spacing: -.06em; font-weight: 500; }
.original-hero .hero-sub { max-width: 620px; font-size: clamp(18px, 1.7vw, 24px); line-height: 1.5; margin: 0 0 82px; }
.original-hero .hero-meta { display: flex; justify-content: space-between; align-items: end; border-top: 1px solid var(--line); padding-top: 18px; color: var(--muted); font-size: 12px; }
.original-hero .eyebrow { color: var(--muted); text-transform: uppercase; letter-spacing: .08em; font-size: 10px; font-weight: 700; }
.original-hero .eyebrow { margin-bottom:0; }
.original-hero .actions { margin-top:24px; }
.original-hero .hero-bottom { margin-top:40px; }
@media(max-width:900px){.original-hero {min-height:auto}.original-hero .section-inner{padding:92px 22px;min-height:90svh}.original-hero .hero-sub{margin-bottom:54px;max-width:78%}}
@media(max-width:560px){.original-hero .hero-sub{font-size:20px;max-width:92%}}