@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap');
:root{--bg:#f5f4f0;--ink:#222320;--line:#d6d5d0}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans','Noto Sans KR',sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}header{height:103px;display:flex;align-items:center;justify-content:space-between;margin:0 4%;border-bottom:1px solid var(--line)}.logo{font-size:43px;letter-spacing:-3px;font-weight:700}.logo span{font-size:12px;letter-spacing:0;vertical-align:top;display:inline-block;margin:11px 0 0 5px}header nav{display:flex;gap:32px;font-size:13px;font-weight:600}.contact{padding:15px 21px;border:1px solid var(--ink);border-radius:5px;font-size:12px}.intro{padding:59px 4% 44px}.eyebrow,.tiny{font-size:11px;letter-spacing:1px;font-weight:600}.dot{display:inline-block;width:7px;height:7px;background:#728068;border-radius:50%;margin-right:8px}h1{font-size:clamp(65px,8.8vw,148px);line-height:.98;letter-spacing:-.065em;margin:31px 0 32px;font-weight:600}h1>span{color:#85857d}.intro-bottom{display:flex;align-items:end;justify-content:space-between}.intro-bottom p{font-size:14px;line-height:1.9;margin:0}.intro-bottom a{font-size:12px;border-bottom:1px solid;padding-bottom:9px}.intro-bottom a span{margin-left:60px}.hero{position:relative;height:590px;margin:0 2%;overflow:hidden;border-radius:7px;color:white;background:#3a3128}.hero>img{width:100%;height:100%;object-fit:cover;object-position:center 57%}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.65),rgba(0,0,0,.02))}.hero-top{position:absolute;top:30px;left:30px;right:30px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.3px}.hero-copy{position:absolute;left:6%;bottom:75px}.hero-copy>span{font-size:10px;letter-spacing:2px}.hero h2{font-size:clamp(28px,3.6vw,52px);line-height:1.45;letter-spacing:-2px;margin:20px 0 35px;font-weight:500}.hero-copy a{font-size:12px;border-bottom:1px solid #aaa;padding-bottom:12px}.hero-copy a span{margin-left:70px}.hero-caption{position:absolute;right:30px;bottom:27px;font-size:11px;color:#ddd}.section{padding:100px 4%}.section-top{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.4px}.section-top>span:last-child{color:#777}.section-heading{display:flex;justify-content:space-between;align-items:end;margin:30px 0 38px}.section-heading h2{font-size:clamp(38px,5vw,74px);letter-spacing:-3px;line-height:1.04;margin:0;font-weight:500}.section-heading p{font-size:13px;line-height:1.9;color:#666;margin-bottom:4px}.filters{display:flex;gap:9px;margin-bottom:24px;flex-wrap:wrap}.filters button{border:1px solid var(--line);background:transparent;border-radius:6px;padding:11px 18px;font-size:11px}.filters .active{background:var(--ink);color:#fff;border-color:var(--ink)}.filters small{margin-left:15px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.product{background:none;border:0;padding:0;text-align:left}.product[hidden]{display:none}.product-img{position:relative;aspect-ratio:1.23;border-radius:7px;overflow:hidden}.product-img svg{width:100%;height:100%;transition:transform .5s}.product:hover svg{transform:scale(1.06)}.sand{background:#ded2be}.sage{background:#bfc5b5}.lavender{background:#d6d1da}.image-tag{position:absolute;top:20px;left:20px;font-size:10px;letter-spacing:1px}.circle-arrow{position:absolute;right:17px;bottom:17px;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;background:#ffffff90}.card-title{display:flex;justify-content:space-between;align-items:center;margin-top:15px}.card-title h3{font-size:18px;letter-spacing:-.5px;font-weight:600;margin:0}.card-title>span{font-size:11px;color:#888}.product p{font-size:11px;color:#6c6c65;margin:9px 0}.concept-note{font-size:10px;color:#7b7b73;line-height:1.8;margin-top:25px}.philosophy{padding:60px 4% 85px;background:#dedfd4}.philosophy-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:12%;margin-top:65px}.philosophy h2{font-size:clamp(45px,6vw,92px);line-height:1.08;letter-spacing:-4px;margin:0;font-weight:500}.philosophy em{font-family:Georgia,serif;font-weight:400}.philosophy h3{font-size:28px;letter-spacing:-1px;line-height:1.55;font-weight:500;margin:20px 0}.philosophy p{font-size:13px;line-height:2;color:#575b50;max-width:430px}.values{margin-top:30px;display:grid}.values span{border-top:1px solid #bcbfb0;padding:15px 0;font-size:11px}.journal{padding-bottom:85px}.article{display:flex;width:100%;text-align:left;align-items:center;gap:38px;padding:29px 0;background:transparent;border:0;border-top:1px solid var(--line)}.article:last-child{border-bottom:1px solid var(--line)}.article>span:first-child{font-size:11px;color:#777}.article small{font-size:10px;letter-spacing:.7px;color:#777}.article h3{font-size:21px;font-weight:500;letter-spacing:-.7px;margin:10px 0 0}.article-arrow{margin-left:auto;font-size:27px;transition:transform .2s}.article:hover .article-arrow{transform:translate(4px,-4px)}.contact-section{background:#252722;color:#f5f4ef;padding:65px 4%}.contact-section h2{font-size:clamp(35px,5vw,70px);font-weight:500;line-height:1.35;letter-spacing:-3px;margin:30px 0}.contact-section>div{display:flex;align-items:end;justify-content:space-between}.contact-section p{font-size:13px;line-height:1.9;color:#bfc0b8}.contact-section button{border:1px solid #777d6c;background:transparent;color:white;padding:18px 28px;border-radius:5px;font-size:12px}.contact-section .concept-note{font-size:10px;color:#94998c}footer{display:flex;justify-content:space-between;align-items:center;padding:35px 4% 135px;gap:20px}footer>span,footer>a:last-child{font-size:10px;color:#6c6c65}.floating{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:6px;padding:8px;background:#242520ee;color:#f6f5ef;border:1px solid #ffffff24;border-radius:10px;box-shadow:0 8px 25px #0003;z-index:10;backdrop-filter:blur(12px)}.floating a{padding:12px 16px;font-size:11px;white-space:nowrap}.floating .mini-logo{font-size:26px;font-weight:700;padding:0 15px}.floating .float-contact{background:#e4e6d7;color:#272a21;border-radius:5px}.floating a:hover{color:#a4b299}.floating .float-contact:hover{background:white;color:#222}dialog{border:0;border-radius:10px;background:var(--bg);color:var(--ink);width:min(610px,90vw);padding:45px}dialog::backdrop{background:#161b18a6;backdrop-filter:blur(5px)}dialog h2{font-size:29px;letter-spacing:-1px;line-height:1.5;margin:20px 0}dialog p{font-size:14px;line-height:2;color:#62635d}.close{position:absolute;right:17px;top:17px;border:0;background:none;font-size:20px}.modal-done{margin-top:20px;background:var(--ink);color:white;padding:12px 24px;border:0;border-radius:4px}:focus-visible{outline:3px solid #a48141;outline-offset:5px}@media(min-width:1700px){main,header,footer{max-width:1700px;margin-left:auto;margin-right:auto}}@media(max-width:700px){header{height:79px}header nav{display:none}.logo{font-size:34px}.contact{font-size:10px;padding:11px}.intro{padding-top:40px}h1{font-size:clamp(49px,10.4vw,74px);margin:30px 0}.eyebrow{font-size:8px;letter-spacing:.5px}.intro-bottom p{font-size:11px}.intro-bottom a{font-size:10px}.intro-bottom a span{margin-left:15px}.hero{height:490px}.hero-top{left:20px;right:20px;font-size:8px}.hero-copy{left:7%;bottom:70px}.hero-caption{font-size:9px;right:20px}.section{padding:65px 5%}.section-heading{display:block}.section-heading h2{font-size:45px;letter-spacing:-2px}.section-heading p{font-size:12px;margin-top:22px}.cards{grid-template-columns:1fr;gap:30px}.product-img{aspect-ratio:1.3}.filters{gap:6px}.filters button{padding:10px 11px;font-size:10px}.philosophy{padding:45px 5%}.philosophy-grid{grid-template-columns:1fr;gap:40px;margin-top:35px}.philosophy h2{font-size:64px}.philosophy h3{font-size:25px}.article{gap:19px;padding:25px 0}.article h3{font-size:16px}.article small{font-size:9px}.contact-section{padding:48px 5%}.contact-section>div{display:block}.contact-section button{margin-top:16px}footer{flex-wrap:wrap;padding:30px 5% 120px}footer>span:nth-child(2){display:none}.floating{bottom:15px;gap:0;max-width:96%}.floating a{padding:11px 10px;font-size:10px}.floating .mini-logo{padding:0 11px}dialog{padding:35px 25px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
