@font-face {
  font-family: "Pretendard Variable"; font-weight: 45 920; font-display: swap;
  src: url('/fonts/PretendardVariable.woff2') format('woff2');
}
:root {
  --paper: #fbf9f4; --ink: #583621; --secondary: #86684a; --line: #ebdcc9;
  --dark: #222923; --sans: "Pretendard Variable", sans-serif; --calligraphy: "Noto Serif KR", serif;
  --gutter: clamp(22px,5vw,76px); --ease: cubic-bezier(.2,.7,.2,1);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 82px; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.65 var(--sans); letter-spacing: -.018em; -webkit-font-smoothing: antialiased; }
body:before { content: ''; position: fixed; inset: 0; z-index: 40; pointer-events: none; background: url('/assets/hanji.webp') center/cover; mix-blend-mode: multiply; opacity: .12; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; border: 0; background: none; cursor: pointer; }
a,button { -webkit-tap-highlight-color: transparent; }
a:focus-visible,button:focus-visible,summary:focus-visible,video:focus-visible { outline: 2px solid var(--secondary); outline-offset: 5px; }
img,video { display: block; max-width: 100%; }
h1,h2,h3,p,figure { margin: 0; }
h1,h2,h3 { font-weight: 400; line-height: 1.35; word-break: keep-all; }
p { word-break: keep-all; }
::selection { background: #e3d5c4; color: var(--ink); }
.hanja { font-family: var(--calligraphy); font-weight: 400; }
.wrap { padding-inline: var(--gutter); max-width: 1440px; margin-inline: auto; }
.eyebrow { font-size: 12px; letter-spacing: .1em; font-weight: 500; line-height: 1.6; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.skip-link { position: fixed; top: -100px; left: 20px; z-index: 200; background: var(--ink); color: white; padding: 12px; }
.skip-link:focus { top: 12px; }
.site-header { height: 80px; padding-inline: var(--gutter); display: flex; align-items: center; justify-content: space-between; position: absolute; inset: 0 0 auto; z-index: 100; border-bottom: 1px solid var(--line); }
.wordmark { display: flex; align-items: center; gap: 11px; font-size: 21px; font-weight: 550; letter-spacing: -.06em; }
.wordmark img { width: 26px; height: 26px; }
.desktop-nav { display: flex; gap: 36px; font-size: 14px; }
.desktop-nav a { padding: 10px 0; position: relative; }
.desktop-nav a:after { content: ''; position: absolute; height: 1px; background: var(--ink); inset: auto 0 5px; transform: scaleX(0); transform-origin: left; transition: transform .4s var(--ease); }
.desktop-nav a:hover:after { transform: scaleX(1); }
.header-actions { display: flex; align-items: center; gap: 20px; }
.header-contact { display: flex; gap: 20px; align-items: center; font-size: 14px; }
.header-contact>span { font-size: 22px; }
.motion-toggle { width: 40px; height: 40px; border-radius: 50%; color: var(--secondary); font-size: 16px; line-height: 1; }
.motion-toggle:hover { background: #eee7dc; }
.menu-toggle,.mobile-nav { display: none; }
.hero { position: relative; min-height: 560px; max-width: 1440px; margin: auto; padding: 145px var(--gutter) 115px; display: grid; grid-template-columns: 1fr 1.05fr; align-items: center; gap: 12px; }
.hero-copy { position: relative; z-index: 1; }
.hero-copy>.eyebrow { color: var(--secondary); margin-bottom: 24px; font-size: 11px; letter-spacing: .1em; }
h1 { font-size: clamp(39px,4.3vw,62px); line-height: 1.28; letter-spacing: -.06em; }
h1>span { display: block; }
.hero-description strong { font-weight: 550; color: var(--ink); }
.hero-description { font-size: 16px; color: var(--secondary); margin-top: 23px; line-height: 1.8; }
.hero-links { display: flex; flex-wrap: wrap; gap: 28px; margin-top: 24px; }
.text-link { display: inline-flex; justify-content: space-between; align-items: center; min-height: 44px; border-bottom: 1px solid var(--line); font-size: 14px; padding: 8px 0; gap: 25px; }
.text-link>span:not(.sr-only) { font-size: 21px; transition: transform .3s var(--ease); }
.text-link:hover { border-color: var(--ink); }
.text-link:hover>span:not(.sr-only) { transform: translate(2px,-2px); }
.hero-art { min-width: 0; aspect-ratio: 1672 / 941; overflow: hidden; mix-blend-mode: multiply; mask-image: radial-gradient(ellipse at center,#000 48%,#000c 65%,transparent 75%); }
.hero-art img { width: 100%; height: 100%; object-fit: cover; animation: painting-drift 24s ease-in-out infinite alternate; }
.hero-bottom { position: absolute; bottom: 24px; left: var(--gutter); right: var(--gutter); display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: 11px; letter-spacing: .08em; color: var(--secondary); }
.hero-bottom a { display: flex; align-items: center; gap: 20px; letter-spacing: 0; font-size: 12px; min-height: 44px; }
.hero-bottom a>span { font-size: 20px; }
.section-heading { padding-top: 42px; border-top: 1px solid var(--line); }
.section-label { display: flex; align-items: center; gap: 18px; margin-bottom: 29px; }
.section-number { font-size: 12px; color: var(--secondary); padding-right: 6px; }
.section-label h2 { font-size: 25px; font-weight: 550; letter-spacing: -.04em; }
.brand-state { font-size: 12px; color: var(--secondary); margin-left: auto; }
.dharma-intro { display: flex; justify-content: space-between; align-items: center; gap: 40px; }
.dharma-intro h3 { font-size: clamp(29px,3vw,42px); letter-spacing: -.05em; }
.english-quote { font-size: 18px; font-weight: 350; line-height: 1.5; }
.english-signature { font-size: 12px; color: var(--secondary); margin-top: 10px; }
.dharma-description { font-size: 16px; color: var(--secondary); margin-top: 20px; }
.experience-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-top: 38px; }
.experience-heading .eyebrow { color: var(--secondary); font-size: 11px; margin-bottom: 9px; }
.experience-heading h3 { font-size: 25px; letter-spacing: -.04em; }
.experience-heading>p { color: var(--secondary); font-size: 14px; }
.journey { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,1fr); align-items: center; gap: 6%; padding-top: 34px; padding-bottom: 40px; }
.journey-theatre { position: relative; aspect-ratio: 1672 / 941; overflow: hidden; mix-blend-mode: multiply; mask-image: linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent),linear-gradient(transparent,#000 5%,#000 95%,transparent); mask-composite: intersect; }
.journey-frame { display: none; position: absolute; inset: 0; opacity: 0; transition: opacity 1.8s ease; pointer-events: none; }
.journey-frame.is-active { display: block; opacity: 1; }
.enhanced .journey-frame { display: block; }
.journey-frame img { width: 100%; height: 100%; object-fit: cover; animation: painting-drift 22s ease-in-out infinite alternate; animation-play-state: paused; }
.journey-frame[data-scene='1'] img { animation-direction: alternate-reverse; }
.journey-frame[data-scene='2'] img { transform-origin: 65% 50%; }
.journey-frame.is-active img { animation-play-state: running; }
.journey-caption { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; color: var(--secondary); }
.journey-caption .eyebrow { font-size: 11px; letter-spacing: .07em; }
.journey-count { white-space: nowrap; }
.journey-panels { position: relative; margin-top: 22px; }
.journey-panel { padding-block: 15px; }
.enhanced .journey-panels { display: grid; }
.enhanced .journey-panel { grid-area: 1/1; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .6s,visibility .6s; }
.enhanced .journey-panel.is-active { opacity: 1; visibility: visible; pointer-events: auto; }
.chapter-copy { position: relative; }
.chapter-symbol { position: absolute; right: 0; top: -5px; font-size: 30px; color: var(--secondary); line-height: 1.3; }
.chapter-counter { font-size: 12px; color: var(--secondary); margin-bottom: 15px; padding-right: 40px; }
.chapter-counter span { margin-left: 6px; }
.chapter-copy h3 { font-size: 36px; letter-spacing: -.05em; }
.chapter-copy>p:last-child { margin-top: 18px; font-size: 16px; color: var(--secondary); line-height: 1.8; }
.chapter-copy>p:last-child br { display: none; }
.journey-navigation { display: flex; gap: 30px; margin-top: 15px; }
.journey-navigation button { padding: 10px 0; min-height: 44px; font-size: 14px; color: var(--secondary); border-bottom: 1px solid transparent; }
.journey-navigation button span { font-size: 12px; margin-right: 8px; }
.journey-navigation button.is-active { color: var(--ink); border-color: var(--ink); font-weight: 550; }
.journey-progress { height: 1px; margin-top: 9px; background: var(--line); overflow: hidden; }
.journey-progress>span { height: 1px; display: block; background: var(--secondary); transform-origin: left; transform: scaleX(var(--journey-progress,0)); }
.ai-story { margin: 0 auto 54px; padding: 30px 0 0; width: calc(100% - var(--gutter)*2); max-width: calc(1440px - var(--gutter)*2); border-top: 1px solid var(--line); display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); gap: 64px; align-items: center; }
.ai-story .eyebrow { color: var(--secondary); font-size: 11px; }
.ai-story h3 { font-size: 26px; letter-spacing: -.045em; margin-top: 10px; }
.ai-story p:not(.eyebrow) { color: var(--secondary); font-size: 16px; margin-top: 12px; }
.ai-origin strong { display: block; font-weight: 550; color: var(--ink); margin-bottom: 7px; }
.ai-story .ai-origin { margin-top: 25px; font-size: 14px; }
.ai-flow { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; text-align: center; }
.ai-node { display: flex; flex-direction: column; align-items: center; gap: 12px; min-width: 76px; }
.ai-node>.hanja { font-size: 29px; line-height: 44px; height: 44px; color: var(--secondary); }
.ai-core { width: 44px; height: 44px; display: grid; place-items: center; }
.ai-core img { width: 31px; height: 31px; }
.ai-thread { height: 1px; flex: 1; max-width: 60px; background: var(--line); margin-top: -33px; }
.gilsangdo-section { background: var(--dark); color: #f5e7c7; padding-block: 42px; position: relative; overflow: hidden; }
.gilsangdo-section>.wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 0 7%; align-items: center; }
.gilsangdo-section .section-label { grid-column: 1/-1; margin-bottom: 25px; }.gilsangdo-section .brand-state,.gilsangdo-section .section-number { color: #c5b797; }.gilsangdo-section .section-label h2>.hanja { margin-left: 14px; color: #c8ad77; font-size: 21px; letter-spacing: .15em; }
.gilsangdo-intro .eyebrow { color: #c5ad80; margin-bottom: 17px; }.gilsangdo-intro h3 { font-size: clamp(31px,3.5vw,50px); line-height: 1.3; letter-spacing: -.05em; }.gilsangdo-intro>p { font-size: 16px; line-height: 1.8; color: #c8c5b6; max-width: 460px; margin-top: 20px; }.gilsangdo-intro>p>br { display: none; }
.collection-cover { position: relative; overflow: hidden; }.collection-cover>img { width: 100%; height: 300px; object-fit: cover; object-position: 50% 70%; transition: transform 1.5s var(--ease); }.collection-cover:hover>img { transform: scale(1.02); }.collection-cover figcaption { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding-top: 13px; color: #baa988; }.collection-cover figcaption>span:first-child { font-size: 24px; letter-spacing: -.02em; font-weight: 350; }.collection-cover figcaption>span:last-child { font-size: 12px; text-align: right; }.collection-cover figcaption br { display: none; }
.collection-section { padding-block: 55px 35px; }.collection-header { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: end; margin-bottom: 30px; }.collection-header .eyebrow { color: var(--secondary); font-size: 12px; margin-bottom: 15px; }.collection-header h2 { font-size: 39px; letter-spacing: -.05em; }.collection-header>p { font-size: 16px; color: var(--secondary); }.collection-header>p>br { display: none; }
.elements { --element: #567343; display: grid; grid-template-columns: 1.1fr 1fr; gap: 8%; align-items: center; }.element-image-wrap { --product-height: 355px; position: relative; height: var(--product-height); overflow: hidden; background: #e1d5c3; }.element-photo { width: 100%; height: 100%; object-fit: cover; transition: opacity .3s,transform 1.3s var(--ease); }.element-image-label { position: absolute; left: 20px; bottom: 16px; color: white; font-size: 12px; letter-spacing: .12em; text-shadow: 0 1px 5px #000; }.element-detail>.eyebrow { color: var(--secondary); font-size: 12px; letter-spacing: 0; }
.element-heading { font-size: 25px; letter-spacing: -.04em; margin-bottom: 21px; }
.element-buttons { display: flex; gap: 12px; margin-top: 14px; margin-bottom: 20px; }.element-buttons button { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 5px 0 12px; border-bottom: 1px solid var(--line); color: #9d8975; position: relative; transition: color .3s,transform .3s; }.element-buttons button>.hanja { font-size: 37px; line-height: 1.3; }.element-buttons button>span:last-child { font-size: 12px; }.element-buttons button.is-active { border-color: var(--element); color: var(--element); }.element-buttons button:hover { transform: translateY(-2px); }
.element-index { font-size: 12px; color: var(--secondary); letter-spacing: .1em; }#element-description h3 { font-size: 32px; letter-spacing: -.04em; margin-top: 5px; }.element-name { color: var(--secondary); font-size: 14px; margin-top: 5px; }.element-context { font-size: 16px; margin-top: 17px; color: var(--secondary); }.element-context>br { display: none; }.element-detail .text-link { margin-top: 15px; min-width: 180px; }.elements[data-element='fire'] { --element: #a24432; }.elements[data-element='earth'] { --element: #997426; }.elements[data-element='metal'] { --element: #676657; }.elements[data-element='water'] { --element: #3e6383; }
.craft-notes { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-top: 28px; align-items: start; }.package-details { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.package-details summary { display: flex; align-items: center; gap: 14px; min-height: 64px; font-size: 14px; cursor: pointer; list-style: none; }.package-details summary::-webkit-details-marker { display: none; }.package-details summary>.hanja { font-size: 24px; color: var(--secondary); }.package-details summary>span:last-child { margin-left: auto; font-size: 23px; transition: transform .3s; }.package-details[open] summary>span:last-child { transform: rotate(45deg); }.package-inside { display: grid; grid-template-columns: 145px 1fr; gap: 20px; padding-bottom: 20px; align-items: start; }.package-inside img { width: 100%; height: 120px; object-fit: cover; }.package-inside p { font-size: 14px; color: var(--secondary); }
.film-section { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: center; padding-block: 20px 55px; }.film-caption .eyebrow { color: var(--secondary); font-size: 12px; margin-bottom: 15px; }.film-caption h2 { font-size: 32px; letter-spacing: -.04em; }.film-caption>p:not(.eyebrow) { font-size: 16px; color: var(--secondary); margin-top: 17px; }.film-caption .text-link { margin-top: 10px; }.film-caption p.film-invitation { margin-top: 16px; font-size: 14px; }
.film-container { position: relative; background: #242823; }.film-container video { width: 100%; aspect-ratio: 16/9; max-height: 280px; object-fit: contain; }.film-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); display: flex; gap: 13px; align-items: center; min-height: 54px; padding: 13px 20px; border: 1px solid #d2b67e; background: #242823c9; color: #f6e8c9; border-radius: 80px; font-size: 12px; letter-spacing: .08em; white-space: nowrap; }.film-play>span:first-child { font-size: 16px; }.film-play[hidden] { display: none; }
.about-section { display: grid; grid-template-columns: 1fr 2.1fr; gap: 45px; border-top: 1px solid var(--line); padding-block: 55px; }.about-label>.eyebrow { color: var(--secondary); margin-bottom: 8px; }.about-label>span { font-size: 13px; color: var(--secondary); }.about-copy>.eyebrow { font-size: 12px; color: var(--secondary); margin-bottom: 18px; }.about-copy h2 { font-size: 36px; letter-spacing: -.05em; }.about-copy>p:not(.eyebrow) { margin-top: 18px; font-size: 16px; line-height: 1.85; color: var(--secondary); max-width: 600px; }.about-copy>p:not(.eyebrow)>br { display: none; }.brand-signatures { display: flex; align-items: center; gap: 22px; margin-top: 24px; }.brand-signatures>a { display: flex; align-items: center; gap: 8px; font-size: 19px; font-weight: 500; }.brand-signatures .hanja { color: var(--secondary); font-size: 17px; }.brand-signatures>span { font-size: 16px; color: var(--secondary); }
.contact-section { padding-block: 40px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.contact-section>.eyebrow { font-size: 12px; color: var(--secondary); margin-bottom: 16px; }
.contact-section>div { display: flex; justify-content: space-between; align-items: center; gap: 30px; }
.contact-section h2 { font-size: 40px; letter-spacing: -.05em; }
.contact-section h2>br { display: none; }
.contact-cta { display: flex; gap: 25px; align-items: center; font-size: 16px; white-space: nowrap; }
.contact-arrow { display: grid; place-items: center; width: 55px; height: 55px; border-radius: 50%; border: 1px solid var(--line); font-size: 28px; transition: transform .4s,background .4s; }
.contact-cta:hover .contact-arrow { transform: translate(2px,-2px); background: #f1ece3; }
.contact-section>p:last-child { margin-top: 17px; font-size: 14px; color: var(--secondary); }
.site-footer { padding-block: 30px 28px; }.footer-top { display: flex; align-items: center; justify-content: space-between; }.footer-top>div { display: flex; align-items: center; gap: 25px; font-size: 13px; }.footer-top>div>a:last-child { font-size: 23px; min-width: 35px; text-align: right; }.footer-bottom { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-top: 22px; font-size: 12px; color: var(--secondary); }.footer-bottom p:first-child { font-size: 13px; color: var(--ink); margin-bottom: 4px; }.footer-bottom>span { font-size: 12px; letter-spacing: .06em; white-space: nowrap; }.business-info { font-style: normal; border-top: 1px solid var(--line); padding-top: 18px; margin-top: 20px; font-size: 12px; line-height: 1.9; color: var(--secondary); }.business-info>div { display: flex; flex-wrap: wrap; gap: 4px 20px; }.business-info a:hover { color: var(--ink); text-decoration: underline; }

@keyframes painting-drift {
  from { transform: scale(1.008) translate(-.2%,.15%); }
  to { transform: scale(1.018) translate(.2%,-.15%); }
}
.page-hidden *,.motion-paused *,.motion-paused *:before,.motion-paused *:after { animation-play-state: paused!important; }
.motion-paused .journey-frame,.motion-paused .journey-panel { transition: none; }
.observed-motion:not(.on-screen) *,.observed-motion:not(.on-screen) *:after { animation-play-state: paused; }
/* Interaction layers preserve the layout and the original photographic assets. */
.interactive-art { position: relative; isolation: isolate; }
.painting-depth { position: absolute; inset: 0; transform: perspective(1100px) translateY(var(--scroll-depth,0px)) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) scale(1.055); transition: transform .65s var(--ease); }
.art-light { position: absolute; inset: 0; z-index: 4; pointer-events: none; opacity: 0; background: radial-gradient(ellipse at var(--light-x,55%) var(--light-y,45%),#fff7e850,transparent 58%); mix-blend-mode: screen; transition: opacity .8s; }
.is-tracking .art-light { opacity: .7; }
.journey-stage { position: relative; min-width: 0; }
.journey-theatre { touch-action: pan-y pinch-zoom; cursor: grab; user-select: none; }
.journey-theatre.is-dragging { cursor: grabbing; }
.journey-frame { z-index: 0; transition: opacity .45s .85s; }
.journey-frame.is-active { z-index: 1; transition: opacity .35s; }
.scene-arrows { position: absolute; right: 17px; bottom: 16px; display: none; gap: 7px; }
.enhanced .scene-arrows { display: flex; }
.scene-arrows button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 40px; height: 40px; padding: 0 12px; background: #fbf9f4e0; border: 1px solid #86684a26; border-radius: 30px; transition: background .3s,transform .3s; }
.scene-arrows button:hover { transform: translateY(-2px); background: var(--paper); }
.scene-arrows button:focus-visible { outline-offset: 3px; }
.scene-next-label { font-size: 12px; }
.scene-arrows button>span:last-child { font-size: 20px; }
.journey-navigation button { position: relative; border: 0; }
.journey-navigation button:after { content: ''; position: absolute; inset: auto 0 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .5s var(--ease); }
.journey-navigation button.is-active:after,.journey-navigation button:hover:after { transform: scaleX(1); }
.ai-thread { overflow: hidden; }
.ai-thread:after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,transparent,var(--secondary),transparent); animation: knowledge-flow 4.8s ease-in-out infinite; }
.ai-thread { position: relative; }
.ai-thread:nth-child(4):after { animation-delay: 1.2s; }
.ai-core img { animation: knowledge-pulse 4.8s ease-in-out infinite; }
@keyframes knowledge-flow { 0%,10% { transform: translateX(-100%); } 60%,100% { transform: translateX(100%); } }
@keyframes knowledge-pulse { 0%,30%,100% { opacity: .65; scale: 1; } 50% { opacity: 1; scale: 1.08; } }
.element-image-wrap { display: flex; align-items: center; justify-content: center; background: #e1d5c3; }
.photo-viewport,.gallery-viewport { position: relative; width: 100%; height: 100%; overflow: hidden; }
.photo-viewport .element-photo { transform-origin: var(--light-x,50%) var(--light-y,50%); transition: scale 1.2s var(--ease); }
.is-tracking .photo-viewport:not(.is-cropped) .element-photo { scale: 1.08; }
.is-cropped { flex: none; width: calc(var(--product-height) * .78); max-width: 100%; }
.is-cropped>img { position: absolute; left: 50%; top: 50%; height: var(--crop-height); width: auto; max-width: none; translate: calc(-1 * var(--crop-x)) calc(-1 * var(--crop-y)); object-fit: initial; }
.element-image-label { z-index: 2; pointer-events: none; font-size: 10px; }
.photo-open { display: none; position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; z-index: 3; cursor: zoom-in; }
.enhanced .photo-open { display: block; }
.photo-open:after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg,transparent 70%,#1a211b45); }
.photo-open>span { position: absolute; z-index: 1; right: 16px; bottom: 12px; display: flex; align-items: center; gap: 12px; font-size: 12px; color: #fff; padding-bottom: 3px; border-bottom: 1px solid #ffffff80; }
.photo-open>span>span { font-size: 18px; transition: transform .4s; }
.photo-open:hover>span>span { transform: translate(3px,-3px); }
.photo-open:focus-visible { outline-offset: -5px; outline-color: #fff; }
.element-buttons button>.hanja { transition: transform .5s var(--ease); }
.element-buttons button:hover>.hanja,.element-buttons button.is-active>.hanja { transform: translateY(-3px); }
.element-buttons button.is-active { transition: border-color .5s,color .5s; }
.text-link>span:not(.sr-only),.contact-arrow,.film-play>span:first-child { translate: var(--arrow-x,0px) var(--arrow-y,0px); transition: translate .4s var(--ease),transform .4s; }
body.gallery-open { overflow: hidden; }
.product-gallery { border: 0; width: min(940px,calc(100% - 44px)); max-width: none; max-height: calc(100dvh - 44px); padding: 24px; color: var(--ink); background: var(--paper); box-shadow: 0 24px 120px #0005; overflow: auto; }
.product-gallery::backdrop { background: #1e211ed9; backdrop-filter: blur(10px); }
.gallery-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.gallery-header .eyebrow { font-size: 10px; color: var(--secondary); }.gallery-header h2 { font-size: 24px; margin-top: 4px; }
.gallery-close { width: 44px; height: 44px; font-size: 30px; border: 1px solid var(--line); border-radius: 50%; flex: none; }
.gallery-image-wrap { --product-height: min(61dvh,560px); height: var(--product-height); display: flex; justify-content: center; background: #e1d5c3; }
.gallery-image { width: 100%; height: 100%; object-fit: contain; }
.gallery-caption { margin-top: 14px; font-size: 14px; color: var(--secondary); }
.motion-paused .painting-depth,.page-hidden .painting-depth { transform: none; transition: none; }
.motion-paused .art-light,.page-hidden .art-light { opacity: 0; }
.motion-paused .element-photo { scale: 1!important; }
.motion-paused .text-link>span,.motion-paused .contact-arrow,.motion-paused .film-play>span { translate: none; }
@media(max-width:760px) {
  .journey-stage { width: 100%; max-width: 560px; justify-self: center; }
  .scene-arrows { right: 10px; bottom: 10px; }.scene-arrows button { height: 36px; min-width: 36px; padding-inline: 10px; }
  .scene-next-label { font-size: 11px; }.element-image-label { left: 14px; letter-spacing: .05em; }.photo-open>span { right: 14px; gap: 8px; }
  .product-gallery { padding: 18px; width: calc(100% - 28px); max-height: calc(100dvh - 28px); }.gallery-header h2 { font-size: 22px; }.gallery-image-wrap { --product-height: min(58dvh,460px); }
}
@media(prefers-reduced-motion:reduce) {
  html:not(.motion-enabled) .painting-depth { transform: none; }
}
@media(max-width:1050px) and (min-width:761px) {
  .hero { min-height: 510px; padding-top: 135px; padding-bottom: 100px; grid-template-columns: 1.05fr 1fr; }
  h1 { font-size: clamp(35px,4.4vw,46px); }
  .hero-copy>.eyebrow { font-size: 10px; letter-spacing: .04em; }
  .hero-bottom>span:last-child { display: none; }
  .dharma-intro { gap: 25px; }.english-quote { font-size: 16px; }
  .journey { gap: 5%; }.chapter-copy h3 { font-size: 30px; }.journey-navigation { gap: 19px; }
  .collection-cover>img { height: 260px; }.collection-cover figcaption>span:first-child { font-size: 21px; }
  .ai-story { gap: 28px; }.ai-story h3 { font-size: 24px; }.ai-node { min-width: 67px; }.ai-flow { font-size: 12px; gap: 7px; }
  .contact-section h2 { font-size: 35px; }.package-inside { grid-template-columns: 110px 1fr; }
}
@media(max-width:760px) {
  :root { --gutter: 22px; }
  .site-header { height: 70px; }.wordmark { font-size: 18px; gap: 9px; }.wordmark img { width: 23px; height: 23px; }
  .desktop-nav,.header-contact { display: none; }.header-actions { margin-left: auto; margin-right: 9px; }
  .menu-toggle { display: flex; flex-direction: column; justify-content: center; gap: 6px; width: 40px; height: 40px; padding: 9px; }
  .menu-toggle>span { width: 23px; height: 1px; background: var(--ink); transition: transform .3s; }
  .menu-toggle[aria-expanded='true']>span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .menu-toggle[aria-expanded='true']>span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .mobile-nav { display: flex; flex-direction: column; gap: 20px; position: fixed; inset: 70px 0 0; background: var(--paper); padding: 35px var(--gutter); visibility: hidden; opacity: 0; transition: opacity .3s,visibility .3s; }
  .mobile-nav.is-open { visibility: visible; opacity: 1; }.mobile-nav a { display: flex; justify-content: space-between; padding: 12px 0; font-size: 29px; }.mobile-nav a>span { font-size: 14px; color: var(--secondary); }
  .hero { min-height: 0; grid-template-columns: minmax(0,1fr); gap: 18px; padding-top: 109px; padding-bottom: 67px; }
  .hero-copy>.eyebrow { font-size: 10px; letter-spacing: .05em; margin-bottom: 19px; }
  h1 { font-size: clamp(36px,8vw,52px); line-height: 1.28; }
  .hero-description { font-size: 16px; margin-top: 18px; }.hero-description br { display: none; }
  .hero-links { margin-top: 15px; gap: 25px; }.text-link { font-size: 13px; gap: 20px; }
  .hero-art { width: 100%; max-width: 460px; justify-self: center; }
  .hero-bottom { bottom: 13px; font-size: 10px; }.hero-bottom>span:last-child { display: none; }
  .section-heading { padding-top: 40px; }.section-label { gap: 11px; margin-bottom: 22px; }.section-label h2 { font-size: 22px; }.section-number { padding-right: 0; }.brand-state { font-size: 12px; }
  .dharma-intro { display: block; }.dharma-intro h3 { font-size: clamp(29px,6.4vw,40px); }.dharma-intro>div { margin-top: 18px; }.english-quote { font-size: 16px; }.english-signature { font-size: 12px; margin-top: 7px; }.dharma-description { font-size: 16px; margin-top: 18px; }.dharma-description br { display: none; }
  .experience-heading { display: block; margin-top: 30px; }.experience-heading h3 { font-size: 24px; }.experience-heading>p { margin-top: 12px; }.experience-heading>p br { display: none; }
  .journey { grid-template-columns: minmax(0,1fr); gap: 24px; padding-top: 24px; padding-bottom: 30px; }
  .journey-theatre { width: 100%; max-width: 560px; justify-self: center; }
  .journey-caption { font-size: 12px; }.journey-panels { margin-top: 10px; }.journey-panel { padding-block: 10px; }.chapter-counter { font-size: 12px; margin-bottom: 12px; }.chapter-copy h3 { font-size: 30px; }.chapter-copy h3 br { display: none; }.chapter-copy>p:last-child { font-size: 16px; margin-top: 13px; }.chapter-symbol { font-size: 26px; top: -4px; }
  .journey-navigation { margin-top: 9px; justify-content: space-between; gap: 20px; }.journey-navigation button { font-size: 14px; }.journey-progress { margin-top: 5px; }
  .ai-story { grid-template-columns: minmax(0,1fr); gap: 28px; padding-top: 25px; margin-bottom: 38px; }.ai-story h3 { font-size: 25px; }.ai-story p:not(.eyebrow) { font-size: 16px; }.ai-flow { gap: 8px; font-size: 12px; max-width: 440px; width: 100%; justify-self: center; }.ai-node { min-width: 72px; }
  .gilsangdo-section { padding-block: 30px; }.gilsangdo-section>.wrap { grid-template-columns: minmax(0,1fr); gap: 25px; }.gilsangdo-section .section-label { margin: 0; }.gilsangdo-section .section-label h2>.hanja { font-size: 19px; margin-left: 8px; }.gilsangdo-intro .eyebrow { font-size: 12px; margin-bottom: 14px; }.gilsangdo-intro h3 { font-size: 35px; }.gilsangdo-intro>p { font-size: 16px; margin-top: 17px; }
  .collection-cover { width: 100%; }.collection-cover>img { height: 220px; }.collection-cover figcaption>span:first-child { font-size: 22px; }.collection-cover figcaption>span:last-child { font-size: 12px; }.collection-cover figcaption br { display: block; }
  .collection-section { padding-block: 35px 20px; }.collection-header { grid-template-columns: minmax(0,1fr); gap: 17px; margin-bottom: 24px; }.collection-header .eyebrow { font-size: 12px; margin-bottom: 13px; }.collection-header h2 { font-size: 35px; }.collection-header>p { font-size: 16px; }.elements { grid-template-columns: minmax(0,1fr); gap: 23px; }.element-image-wrap { --product-height: 265px; }.element-buttons { margin-top: 11px; margin-bottom: 18px; gap: 10px; }.element-buttons button>.hanja { font-size: 35px; }.element-detail>.eyebrow { font-size: 12px; }#element-description h3 { font-size: 29px; }.element-context { font-size: 16px; margin-top: 15px; }.element-detail .text-link { margin-top: 12px; }.element-index { font-size: 12px; }
  .craft-notes { grid-template-columns: minmax(0,1fr); gap: 0; margin-top: 25px; }.package-details+.package-details { border-top: 0; }.package-details summary { min-height: 61px; gap: 11px; font-size: 13px; }.package-details summary>.hanja { font-size: 23px; }.package-inside { grid-template-columns: 105px minmax(0,1fr); gap: 15px; }.package-inside p { font-size: 14px; }.package-inside img { height: 110px; }
  .film-section { grid-template-columns: minmax(0,1fr); gap: 20px; padding-block: 15px 35px; }.film-caption .eyebrow { font-size: 12px; margin-bottom: 12px; }.film-caption h2 { font-size: 29px; }.film-caption>p:not(.eyebrow) { font-size: 16px; margin-top: 13px; }.film-caption>p:not(.eyebrow)>br { display: none; }.film-container { max-width: 530px; width: 100%; }.film-container video { max-height: 235px; }.film-play { min-height: 48px; padding: 11px 17px; font-size: 12px; }
  .about-section { grid-template-columns: minmax(0,1fr); gap: 25px; padding-block: 35px; }.about-label { display: flex; align-items: center; justify-content: space-between; }.about-label>.eyebrow { margin: 0; font-size: 12px; }.about-label>span { font-size: 12px; }.about-copy>.eyebrow { font-size: 12px; margin-bottom: 15px; }.about-copy h2 { font-size: clamp(27px,6vw,37px); }.about-copy>p:not(.eyebrow) { font-size: 16px; margin-top: 16px; }.brand-signatures { margin-top: 22px; gap: 19px; }.brand-signatures>a { font-size: 18px; }.brand-signatures .hanja { font-size: 16px; }
  .contact-section { padding-block: 28px 30px; }.contact-section>.eyebrow { font-size: 12px; margin-bottom: 15px; }.contact-section>div { display: block; }.contact-section h2 { font-size: 33px; }.contact-section h2>br { display: block; }.contact-cta { margin-top: 20px; justify-content: space-between; font-size: 15px; }.contact-arrow { width: 48px; height: 48px; font-size: 26px; }.contact-section>p:last-child { font-size: 13px; margin-top: 18px; }
  .site-footer { padding-block: 25px; }.footer-top .wordmark { font-size: 16px; gap: 7px; }.footer-top>div { gap: 16px; font-size: 12px; }.footer-top>div>a:last-child { min-width: 23px; }.footer-bottom { display: block; margin-top: 18px; }.footer-bottom>span { display: block; margin-top: 15px; font-size: 12px; }.footer-bottom p:last-child { font-size: 12px; }.business-info { margin-top: 17px; padding-top: 15px; font-size: 12px; }.business-info>div { gap: 2px 14px; }.business-info>div:first-child { flex-direction: column; }.business-info>p { margin-block: 5px; }
}
@media(max-width:380px) {
  .hero-links { gap: 22px; }.text-link { gap: 16px; }.collection-cover>img { height: 195px; }.element-image-wrap { --product-height: 245px; }.footer-top>div { gap: 12px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  html:not(.motion-enabled) *,html:not(.motion-enabled) *:before,html:not(.motion-enabled) *:after { animation: none!important; transition-duration: .01ms!important; }
}