@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable-dynamic-subset.css');

/* Korean readability upgrade — Pretendard */
html,body,button,input,textarea,select{
  font-family:"DM Sans","Pretendard Variable","Pretendard",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  font-weight:400;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

/* Korean display typography */
h1,h2,h3,h4,h5,h6,
.founder strong,
.case-question,
.studio-case-copy .case-prompt,
.faq-list summary,
.career-list h5,
.career-detail-list h5,
.process-list h3,
.publication-archive h4,
.book-design-band h3{
  font-family:"Pretendard Variable","Pretendard",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}

/* Previously 300-weight Korean display text: raise to regular for legibility */
.hero h1,
.research-intro h2,
.books-head h2,
.studio h2,
.about h2,
.card-copy h3,
.book-list h3,
.notes-grid h2,
.notes-grid h3,
.archive-head h3,
.work-head h3,
.publication-groups h3,
.work-card h4,
.case-copy h4,
.case-copy .case-question,
.career-intro h4,
.atlas-copy h3,
.commissioned-head h3,
.publication-archive h4,
.book-design-band h3,
.studio-hero h1,
.situation-head h2,
.service-intro h2,
.process-head h2,
.proof-grid h2,
.situation-list h3,
.service-offers h3,
.studio-case-copy h2,
.studio-case-copy .case-prompt,
.studio-inquiry h2{
  font-weight:400!important;
}

/* Slightly firmer small Korean headings */
.career-list h5,
.career-detail-list h5,
.process-list h3,
.founder strong,
.publication-archive h4,
.faq-list summary{
  font-weight:500!important;
}

/* Body copy: slightly firmer without making the editorial layout heavy */
p,li,dd,summary,.detail-toggle,.note-toggle,.publication-project{
  font-weight:400;
}

/* Navigation and controls benefit from medium weight on Korean screens */
.site-header nav,
.menu-toggle,
.text-link,
.store-link,
.book-store-link,
.studio-page-link,
.all-work-link,
.inquiry-grid a{
  font-weight:500;
}

/* Studio active menu: keep text blue, use a neutral gray underline */
.site-header nav a.studio-nav-active::after{
  width:100%!important;
  background:#8b8b86!important;
}

/* Home + Studio hero: slightly tighter first-screen height */
.hero,
.studio-hero{
  min-height:calc(88vh - 76px)!important;
}
.hero{
  padding-top:3.8rem!important;
  padding-bottom:7.5rem!important;
}
.studio-hero{
  padding-top:3.8rem!important;
  padding-bottom:6.5rem!important;
}
.hero h1,
.studio-hero h1{
  margin:4vh 0!important;
}

/* About: reduce vertical breathing room */
.about.section-pad{
  padding-top:5.25rem!important;
  padding-bottom:5.25rem!important;
}
.about-grid{
  margin-top:4rem!important;
}
.founder{
  margin-top:3rem!important;
}

/* Studio hero: keep only the section identity on the left */
.studio-hero-meta span:last-child{
  display:none!important;
}

/* Align Studio hero CTA to the same two-column start line as the home hero */
.studio-hero-bottom{
  grid-template-columns:1fr 1fr!important;
  gap:3rem!important;
  align-items:start!important;
}
.studio-hero-cta{
  align-self:start!important;
  justify-self:stretch!important;
  margin-top:0!important;
}

/* Studio hero orbit: exact home geometry and motion, gray rings, acid-green core */
@keyframes studio-core-pulse{
  0%,100%{transform:scale(.9);box-shadow:0 0 0 0 rgba(201,255,61,.28)}
  50%{transform:scale(1.08);box-shadow:0 0 0 24px rgba(201,255,61,0)}
}
.studio-signal{
  width:34vw!important;
  height:34vw!important;
  right:-8vw!important;
  top:14vh!important;
  border:1px solid rgba(104,104,99,.35)!important;
  border-radius:50%!important;
  will-change:transform;
  animation:orbit-float 7s ease-in-out infinite!important;
  box-shadow:none!important;
}
.studio-signal::after{
  content:"";
  position:absolute;
  inset:-12%;
  border:1px solid rgba(104,104,99,.16);
  border-radius:50%;
  animation:halo-breathe 6.5s ease-in-out infinite;
}
.studio-signal::before{
  content:none!important;
}
.studio-signal span{
  inset:13%!important;
  border:1px solid rgba(104,104,99,.20)!important;
  border-radius:50%!important;
  will-change:transform,opacity;
  animation:ring-breathe 5.6s ease-in-out infinite!important;
}
.studio-signal span:nth-child(2){
  inset:28%!important;
  border-color:rgba(104,104,99,.20)!important;
  animation-delay:-1.8s!important;
  animation-duration:6.8s!important;
}
.studio-signal i{
  inset:43%!important;
  background:var(--acid)!important;
  border-radius:50%!important;
  animation:studio-core-pulse 3.2s ease-in-out infinite!important;
  box-shadow:0 0 0 0 rgba(201,255,61,.24);
}

/* Studio situation cards: tighter vertical rhythm */
.situation-list article{
  min-height:245px!important;
  padding:1.55rem 1.8rem!important;
}
.situation-list h3{
  margin:2.35rem 0 1.4rem!important;
}
.situation-list article>span{
  margin-bottom:.2rem;
}

/* Studio project inquiry: same vertical sizing as the home contact section */
.studio-page main>section.studio-inquiry{
  min-height:auto!important;
  padding-top:5rem!important;
  padding-bottom:5rem!important;
}
.studio-inquiry h2{
  margin-top:1.35rem!important;
  margin-bottom:1.9rem!important;
}

@media(max-width:800px){
  .hero,
  .studio-hero{
    min-height:calc(80svh - 64px)!important;
    padding-top:2.6rem!important;
    padding-bottom:3.6rem!important;
  }
  .hero h1,
  .studio-hero h1{
    margin:2.35rem 0!important;
  }
  .hero-bottom{
    gap:1.35rem!important;
  }
  .studio-hero-bottom{
    grid-template-columns:1fr!important;
    gap:1.75rem!important;
  }
  .about.section-pad{
    padding-top:4rem!important;
    padding-bottom:4rem!important;
  }
  .about-grid{
    margin-top:3rem!important;
  }
  .studio-hero-cta{
    margin-top:0!important;
  }
  .studio-signal{
    width:75vw!important;
    height:75vw!important;
    right:-35vw!important;
    top:9vh!important;
  }
  .orbit{
    top:9vh!important;
  }
  .situation-list article{
    min-height:220px!important;
    padding:1.4rem!important;
  }
  .situation-list h3{
    margin:2rem 0 1.2rem!important;
  }
  .studio-page main>section.studio-inquiry{
    min-height:auto!important;
    padding-top:5rem!important;
    padding-bottom:5rem!important;
  }
  .studio-inquiry h2{
    margin-top:1rem!important;
    margin-bottom:1.5rem!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .studio-signal,.studio-signal::after,.studio-signal span,.studio-signal i{animation:none!important}
}


/* Compact homepage section introductions on phones. */
@media(max-width:800px){
  body:not(.studio-page) .research-intro,
  body:not(.studio-page) .books-head{
    gap:1.25rem;
    margin:2rem 0 2.5rem;
  }
  body:not(.studio-page) .research-intro h2,
  body:not(.studio-page) .books-head h2{
    font-size:clamp(1.65rem,6.5vw,2.2rem);
    line-height:1.3;
    letter-spacing:-.04em;
    word-break:keep-all;
    overflow-wrap:break-word;
  }
  body:not(.studio-page) .research-intro p,
  body:not(.studio-page) .books-head>p{
    margin:0;
    max-width:36em;
    font-size:1rem;
    line-height:1.7;
    word-break:keep-all;
    overflow-wrap:break-word;
  }
  body:not(.studio-page) .books-head .eyebrow{
    margin:0 0 .75rem;
    font-size:.68rem;
  }
  body:not(.studio-page) .studio-layout,
  body:not(.studio-page) .about-grid{
    margin-top:2rem!important;
    gap:2rem;
  }
  body:not(.studio-page) .archive-block,
  body:not(.studio-page) .selected-work,
  body:not(.studio-page) .commissioned-head,
  body:not(.studio-page) .atlas-portal{
    margin-top:3rem;
  }
  body:not(.studio-page) .archive-block,
  body:not(.studio-page) .commissioned-head{
    gap:1.5rem;
  }
  body:not(.studio-page) .notes-grid{
    margin-top:2rem;
  }
  body:not(.studio-page) main p{
    word-break:keep-all;
    overflow-wrap:break-word;
  }
}

/* Reading hierarchy: display 400, section 500, small heading 600. */
.hero h1,.studio-hero h1{
  letter-spacing:-.04em;
  line-height:1.12;
}
.research-intro h2,.books-head h2,.studio h2,.about h2,
.card-copy h3,.book-list h3,.notes-grid h2,.notes-grid h3,
.archive-head h3,.work-head h3,.case-copy h4,.career-intro h4,
.atlas-copy h3,.commissioned-head h3,.book-design-band h3,
.situation-head h2,.service-intro h2,.process-head h2,.proof-grid h2,
.studio-case-copy h2,.studio-inquiry h2{
  font-weight:500!important;
}
.publication-groups h3,.work-card h4,.archive-list h4,
.career-list h5,.career-detail-list h5,.publication-archive h4,
.situation-list h3,.service-offers h3,.process-list h3,.services h3{
  font-weight:600!important;
}
.case-copy dd,.studio-case-copy dd,
.career-list p,.career-detail-list small,.publication-archive p,
.publication-groups span,.work-card span,.role-note,.book-design-band>span{
  font-size:.875rem;
  line-height:1.65;
  word-break:keep-all;
  overflow-wrap:anywhere;
}
.case-copy dt,.studio-case-copy dt,.publication-hint,.period-note,
.offer-time,.studio-project-link,.notes-footer>span,.note-date,
.book-store-link,.note-toggle,.note-detail a{
  font-size:.8125rem;
  line-height:1.5;
}
.studio-page main p{
  word-break:keep-all;
  overflow-wrap:break-word;
}
@media(max-width:800px){
  .hero h1,.studio-hero h1{
    line-height:1.18;
  }
  .note-detail p{
    font-size:1rem;
  }
  .studio-case-copy dl div{
    grid-template-columns:64px minmax(0,1fr);
    gap:.5rem;
  }
}