@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable-dynamic-subset.css');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Manrope:wght@400;500;600&display=swap');

:root{
  --type-ko:'Pretendard Variable','Pretendard','Noto Sans KR',sans-serif;
  --type-en:'Manrope','Pretendard Variable','Pretendard',sans-serif;
  --type-display:'Cormorant Garamond','Pretendard Variable','Pretendard',serif;
  --type-hero:clamp(52px,4.8vw,64px);
  --type-page:clamp(36px,3.3vw,44px);
  --type-section:clamp(24px,2.1vw,28px);
  --type-artwork:clamp(20px,1.9vw,26px);
  --type-body:clamp(16px,1.2vw,18px);
  --type-info:clamp(14px,1vw,15px);
  --type-caption:clamp(12px,.9vw,14px);
}

.footer-privacy-link{color:inherit;text-decoration:none;opacity:.72;border-bottom:1px solid transparent;padding-bottom:3px;white-space:nowrap}
.footer-privacy-link:hover,.footer-privacy-link:focus-visible{border-color:currentColor;opacity:1}

html[lang='ko'] body,
html[lang='ko'] button,
html[lang='ko'] input,
html[lang='ko'] select,
html[lang='ko'] textarea{font-family:var(--type-ko)!important}
html[lang='en'] body,
html[lang='en'] button,
html[lang='en'] input,
html[lang='en'] select,
html[lang='en'] textarea{font-family:var(--type-en)!important}
body{font-size:var(--type-body);font-weight:400!important;line-height:1.7;letter-spacing:0}

.brand,.site-nav,.lang-switch,.exhibition-brand,.exhibition-top-actions,.archive-detail-brand,.archive-detail-actions,
.eyebrow,.archive-kicker,.detail-kicker,.archive-location,.archive-card-meta,.art-caption,.intro-meta,
.portfolio-toolbar,.pdf-viewer-toolbar,footer,.view-moment,.text-link,.timeline-archive-link,
.archive-document-open,.archive-document-download{font-family:var(--type-en)!important}
.site-nav,.exhibition-top-actions,.archive-detail-actions{font-size:13px!important;font-weight:500!important;line-height:1.4;letter-spacing:.06em!important}
.brand-name,.exhibition-brand span,.archive-detail-brand span{font-size:18px!important;font-weight:600!important;line-height:1.1;letter-spacing:.07em!important}
.brand-role,.exhibition-brand small,.archive-detail-brand small{font-size:11px!important;font-weight:500;line-height:1.2;letter-spacing:.12em!important}
.lang-switch,.lang-btn,#about-lang-toggle,#exhibition-lang-toggle,#archive-lang-toggle{font-size:12px!important;font-weight:500!important;line-height:1.4;letter-spacing:.05em!important}

h1,h2,h3,.series-list strong,.archive-document-card h4,.video-gallery-meta b{
  font-family:var(--type-display)!important;font-weight:500!important;letter-spacing:-.02em!important
}
h1{font-size:var(--type-page)!important;line-height:1.05!important}
h2{font-size:var(--type-section)!important;line-height:1.15!important}
h3{font-size:var(--type-artwork)!important;line-height:1.2!important}
.hero-identity-title,#about-page-title,.about-page-title-wrap h1{font-size:var(--type-hero)!important;line-height:1!important}
.page-hero h1,.archive-hero h1,.archive-detail-hero h1{font-size:var(--type-page)!important;line-height:1.05!important}
.contact-copy h2{font-size:var(--type-page)!important;line-height:1.15!important}
.section-heading h2,.statement-copy h2,.series-directory-intro h2,.exhibition-section-heading h2,
.archive-next h2,.archive-gallery-head h2,.archive-detail-next h2,.archive-directory-heading h2,
.video-gallery-section .section-heading h2{font-size:var(--type-section)!important;line-height:1.15!important}
.featured-project-card h3,.archive-card h3,.timeline article strong,.text-card h3,.critic-card h3,
.archive-directory-copy h3,.archive-document-card h4,.video-gallery-meta b,.series-list strong{font-size:var(--type-artwork)!important;line-height:1.2!important}

p,.section-copy,.intro-large,.series-directory-intro>p,.statement-copy>p:not(.eyebrow),.archive-description,
.archive-hero-meta p,.detail-meta>p,.archive-next>p,.about-page-copy p,.about-page-intro,
.page-hero p,.contact-copy>p,.text-card-body,.critic-modal-body{font-size:var(--type-body)!important;font-weight:400!important;line-height:1.75!important;letter-spacing:0!important}
.about-page-deck{font-family:inherit!important}
.exhibition-page-body .archive-hero-meta p{font-family:inherit!important}
.art-caption,.art-meta,.work-meta,.archive-place,.timeline article span,.contact-item,.bio-facts,
.archive-document-card>p,.video-gallery-meta em{font-size:var(--type-info)!important;font-weight:400!important;line-height:1.6!important;letter-spacing:.01em!important}
.eyebrow,.archive-kicker,.detail-kicker,.archive-location,.archive-card-meta,.intro-meta,
.archive-shot figcaption,.archive-lead figcaption,.portfolio-title span,.pdf-viewer-toolbar span{
  font-size:var(--type-caption)!important;font-weight:500!important;line-height:1.45!important;letter-spacing:.08em!important
}

button,a,input,select,textarea{font-weight:400}
input,select,textarea{font-size:16px!important;line-height:1.5!important}
label,.field-label{font-size:14px!important;font-weight:500!important;line-height:1.45!important;letter-spacing:.01em!important}

@media(max-width:700px){
  :root{
    --type-hero:clamp(36px,10vw,44px);
    --type-page:clamp(28px,8vw,34px);
    --type-section:clamp(20px,5.8vw,24px);
    --type-artwork:clamp(18px,5.4vw,22px);
    --type-body:clamp(15px,4vw,16px);
    --type-info:clamp(13px,3.6vw,14px);
    --type-caption:clamp(12px,3.3vw,13px);
  }
  .site-nav{font-size:16px!important;line-height:1.4}
  .brand-name,.exhibition-brand span,.archive-detail-brand span{font-size:15px!important}
  .brand-role,.exhibition-brand small,.archive-detail-brand small{font-size:10px!important}
  .lang-switch,.lang-btn,#about-lang-toggle,#exhibition-lang-toggle,#archive-lang-toggle{font-size:11px!important}
  .hero-note,.scroll-cue,.view-moment,.text-link,.timeline-archive-link,
  .archive-document-open,.archive-document-download{font-size:12px!important;line-height:1.45!important}
}
