/* quietjoon.com */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #faf8f5; color: #2d2926; font-family: 'Lato', sans-serif; font-weight: 300; line-height: 1.8; position: relative; }
.ink-wash { position: fixed; top: 15%; left: 25%; width: 350px; height: 350px; background: radial-gradient(circle at 30% 40%, #d4cec6 0%, transparent 60%); pointer-events: none; opacity: 0.4; }
.arrive { max-width: 700px; margin: 0 auto; padding: 8rem 2rem 3rem; }
.grid-thirds { display: grid; grid-template-columns: 2fr 3fr; }
.grid-thirds.reverse { grid-template-columns: 3fr 2fr; }
.brand-col, .content-col { }
.empty-col { background-color: #e8e4de; display: none; }
.moss-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #7d8c6e; margin-bottom: 0.5rem; }
.brand { font-family: 'Cormorant', serif; font-weight: 400; font-size: clamp(2.5rem, 5vw, 3.5rem); color: #2d2926; }
.quiet-motif { font-family: 'Cormorant', serif; font-weight: 400; font-size: 1rem; color: #7d8c6e; opacity: 0.5; margin-top: 0.3rem; }
.ink-line { border-top: 1px solid #2d2926; width: 80%; margin: 3rem auto; }
.ink-line.short { width: 30%; }
.work { max-width: 700px; margin: 0 auto; padding: 2rem 2rem 3rem; }
.section-title { font-family: 'Cormorant', serif; font-weight: 400; font-size: 1.4rem; color: #7d8c6e; margin-bottom: 0.5rem; }
.body-text { font-size: 0.85rem; color: #2d2926; }
.garden { text-align: center; padding: 4rem 2rem; }
.stones { display: flex; justify-content: center; gap: 2rem; margin-bottom: 1.5rem; }
.stone { width: 16px; height: 16px; border-radius: 50%; background: #8b8178; }
.rest { max-width: 700px; margin: 0 auto; padding: 3rem 2rem 6rem; text-align: center; }
.close-text { font-family: 'Cormorant', serif; font-weight: 400; font-size: 1rem; color: #8b8178; margin-top: 2rem; }
.fade-in { opacity: 0; transform: translateY(12px); transition: opacity 0.5s ease, transform 0.5s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }