*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f1efe9;color:#111;font-family:Arial,"Noto Sans KR",sans-serif}a{color:inherit;text-decoration:none}header{position:fixed;z-index:20;width:100%;padding:22px 4vw;display:flex;justify-content:space-between;color:#fff;mix-blend-mode:difference}header b{font-size:14px}header em,footer em{font-size:11px}nav{display:flex;gap:22px;font-size:10px}.hero{height:100svh;min-height:620px;position:relative;background:#111;color:#fff}.hero-bg{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.1)),url("https://i.ytimg.com/vi/iaPnLdOG8xk/maxresdefault.jpg") center/cover}.hero-copy{position:absolute;left:4vw;bottom:7vh}.hero-copy small,.title small{letter-spacing:.16em}.hero h1{font-size:clamp(60px,11vw,160px);line-height:.78;letter-spacing:-.07em;margin:24px 0}.hero p{font-size:14px}.hero-copy>a{display:block;margin-top:30px;font-size:10px;letter-spacing:.14em}.intro,#work,#services,#about{padding:9vw 4vw;border-bottom:1px solid #c9c6bd}.intro{display:grid;grid-template-columns:2fr 1fr;gap:8vw}.intro h2{font-size:clamp(30px,4vw,58px);line-height:1.15;letter-spacing:-.05em;margin:0}.intro p{align-self:end;color:#666}.title{display:grid;grid-template-columns:1fr 2fr;margin-bottom:7vw}.title h2{font-size:clamp(60px,9vw,130px);line-height:.82;letter-spacing:-.065em;margin:0}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7vw 2vw}.card:nth-child(3n+1){grid-column:span 2}.card button{width:100%;padding:0;border:0;background:#ddd;position:relative;overflow:hidden;cursor:pointer}.card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;transition:.5s}.card button:hover img{transform:scale(1.015);filter:brightness(.72)}.card i{position:absolute;left:18px;bottom:18px;color:#fff;font-size:10px;opacity:0}.card button:hover i{opacity:1}.card small{display:block;border-top:1px solid #111;margin-top:10px;padding-top:12px;letter-spacing:.12em}.card h3{font-size:clamp(25px,3vw,48px);letter-spacing:-.05em;margin:7px 0}.card p{margin:0;color:#666;font-size:12px}.services,.about{margin-left:33.33%}.services article{display:grid;grid-template-columns:45px 1fr 1fr;gap:20px;padding:26px 0;border-top:1px solid}.services b,.services p{font-size:11px}.services h3{margin:0;font-size:30px}.services p{margin:0;color:#666;line-height:1.7}.about p{font-size:clamp(25px,3vw,42px);line-height:1.35;letter-spacing:-.04em}.about small{display:block;margin-top:55px;letter-spacing:.12em}.contact{min-height:85svh;background:#111;color:#fff;padding:8vw 4vw;display:flex;flex-direction:column;justify-content:center}.contact h2{font-size:clamp(85px,14vw,210px);line-height:.75;letter-spacing:-.08em;margin:8vh 0 5vh}.contact>a{border-bottom:1px solid;width:max-content;padding-bottom:6px;margin-top:20px}.contact i{font-size:10px;opacity:.45;margin-top:10px}footer{padding:28px 4vw}footer span{float:right;font-size:9px}#modal{display:none;position:fixed;z-index:100;inset:0;background:#000;align-items:center;justify-content:center;padding:6vw}#modal.open{display:flex}#modal iframe{width:min(1200px,100%);aspect-ratio:16/9;border:0}#close{position:absolute;right:25px;top:20px;color:#fff;background:none;border:0;cursor:pointer}@media(max-width:720px){header{padding:18px}nav a:not(:last-child){display:none}.hero-copy{left:18px}.hero h1{font-size:19vw}.intro{grid-template-columns:1fr;padding:90px 18px}#work,#services,#about{padding:90px 18px}.title{grid-template-columns:1fr}.title h2{margin-top:20px}.grid{grid-template-columns:1fr;gap:60px}.card:nth-child(3n+1){grid-column:auto}.services,.about{margin-left:0}.services article{grid-template-columns:30px 1fr}.services p{grid-column:2}.contact{padding:80px 18px}.contact h2{font-size:22vw}#modal{padding:0}}
/* v2 refinements */
.hero-copy{left:4vw;right:4vw;bottom:8vh}
.hero-brand{
  font-size:clamp(54px,9.2vw,142px);
  line-height:.82;
  letter-spacing:-.065em;
  font-weight:700;
  text-transform:uppercase;
  max-width:95vw;
}
.hero-brand em{
  font-size:.22em;
  font-weight:400;
  letter-spacing:0;
  margin-left:.22em;
  vertical-align:baseline;
}
.hero h1{
  font-size:clamp(17px,2.2vw,32px);
  line-height:1;
  letter-spacing:.06em;
  font-weight:400;
  margin:32px 0 18px;
}
.hero p{
  font-size:clamp(20px,2.2vw,32px);
  line-height:1.35;
  letter-spacing:-.035em;
  margin:0;
}
.grid{
  display:block;
  max-width:980px;
  margin:0 auto;
}
.card,
.card:nth-child(3n+1){
  width:100%;
  margin:0 0 clamp(70px,9vw,130px);
}
.card img{aspect-ratio:16/9}
@media(max-width:720px){
  .hero-copy{left:18px;right:18px;bottom:54px}
  .hero-brand{font-size:15vw;line-height:.83}
  .hero-brand em{display:block;font-size:.25em;margin:10px 0 0 2px}
  .hero h1{font-size:14px;line-height:1.3;margin:28px 0 16px;letter-spacing:.04em}
  .hero p{font-size:21px;line-height:1.4}
  .grid{max-width:none}
  .card,.card:nth-child(3n+1){margin-bottom:72px}
}

/* v3 */
.hero h1{font-size:clamp(22px,2.8vw,40px)}
.hero p{font-size:clamp(24px,2.8vw,40px)}
.edit-toggle{
 position:fixed;z-index:200;right:18px;bottom:18px;border:1px solid currentColor;
 background:#f1efe9;color:#111;padding:10px 13px;font:10px Arial,sans-serif;
 letter-spacing:.1em;cursor:pointer
}
body.editing [data-edit]{outline:1px dashed #8b887f;outline-offset:4px;cursor:text}
body.editing [data-edit]:focus{outline:2px solid #111;background:rgba(255,255,255,.35)}
.edit-note{position:fixed;z-index:199;right:18px;bottom:62px;background:#111;color:#fff;
 padding:9px 12px;font:10px Arial,sans-serif;display:none}
body.editing .edit-note{display:block}
@media(max-width:720px){.hero h1{font-size:16px}.hero p{font-size:23px}}

.admin-link{position:fixed;z-index:30;right:18px;bottom:18px;background:#111;color:#fff;padding:10px 13px;font-size:9px;letter-spacing:.12em}

/* v4: same-page embedded video player */
.work-thumb{display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;text-align:left;position:relative}
.work-thumb img{display:block;width:100%;height:auto}
.play-mark{position:absolute;left:22px;bottom:20px;background:#f4f1ea;color:#111;padding:9px 12px;font-size:11px;letter-spacing:.14em}
.video-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:4vw}
.video-modal.is-open{display:flex}
.video-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.92)}
.video-modal__panel{position:relative;z-index:1;width:min(1280px,92vw)}
.video-modal__ratio{position:relative;width:100%;aspect-ratio:16/9;background:#000}
.video-modal__ratio iframe{position:absolute;inset:0;width:100%;height:100%}
.video-modal__close{position:absolute;right:0;top:-48px;border:0;background:transparent;color:#fff;font-size:36px;line-height:1;cursor:pointer}
body.modal-open{overflow:hidden}
@media(max-width:700px){
  .video-modal{padding:0}
  .video-modal__panel{width:100vw}
  .video-modal__close{top:-46px;right:14px}
  .play-mark{left:12px;bottom:12px}
}


/* FFS unified embedded player */
.work-thumb{
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:none;
  cursor:pointer;
  text-align:left;
  position:relative;
}
.work-thumb img{
  display:block;
  width:100%;
  height:auto;
}
.play-mark{
  position:absolute;
  left:22px;
  bottom:20px;
  background:#f4f1ea;
  color:#111;
  padding:9px 12px;
  font-size:11px;
  letter-spacing:.14em;
}
.ffs-video-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:4vw;
}
.ffs-video-modal.is-open{display:flex}
.ffs-video-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.92);
}
.ffs-video-panel{
  position:relative;
  z-index:1;
  width:min(1280px,92vw);
}
.ffs-video-ratio{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  background:#000;
}
.ffs-video-ratio iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.ffs-video-close{
  position:absolute;
  right:0;
  top:-48px;
  border:0;
  background:transparent;
  color:#fff;
  font-size:36px;
  line-height:1;
  cursor:pointer;
}
body.ffs-modal-open{overflow:hidden}

@media(max-width:700px){
  .ffs-video-modal{padding:0}
  .ffs-video-panel{width:100vw}
  .ffs-video-close{top:-46px;right:14px}
  .play-mark{left:12px;bottom:12px}
}

/* 작품 설명의 줄바꿈 유지 */
.card p {
  white-space: pre-line;
  overflow-wrap: anywhere;
  line-height: 1.7;
}