:root {
    --green: #2B6B2F;
    --green-dark: #1E4D21;
    --green-light: #4A8B4E;
    --golden: #D4A530;
    --cream: #FCE8D5;
    --cream-dark: #F2D5BC;
    --white: #FFF9F4;
    --text: #2C2C2C;
    --text-light: #6B6B6B;
    --border: #E8DCD0;
    --shadow: rgba(43,107,47,0.08);
    --kakao: #FEE500;
    --kakao-text: #3A1D1D;
    --radius: 12px;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{font-family:'Gowun Dodum',-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',sans-serif;font-size:16px;line-height:1.7;color:var(--text);background:var(--cream);word-break:keep-all;overflow:hidden;height:100vh;height:100dvh}
img{max-width:100%;height:auto;display:block}
a{color:var(--green);text-decoration:none}
a:hover{text-decoration:underline}
ul,ol{list-style:none}

.screen{display:flex;position:fixed;inset:0;z-index:1;flex-direction:column;opacity:0;visibility:hidden;transition:opacity 0.8s ease,visibility 0.8s ease}
.screen.active{opacity:1;visibility:visible}

#splash{background:var(--cream);align-items:center;justify-content:center;z-index:10}
.splash-inner{padding:20px}
.logo-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.logo-link:hover{text-decoration:none}
.logo-link:focus-visible{outline:2px solid var(--green);outline-offset:8px;border-radius:999px}
.splash-logo{width:120px;height:auto;animation:fadeIn 0.6s ease}
@keyframes fadeIn{from{opacity:0;transform:scale(0.9)}to{opacity:1;transform:scale(1)}}
@media(min-width:768px){.splash-logo{width:160px}}

#menu{background:var(--cream);flex-direction:column;align-items:center;padding:clamp(28px,8vh,48px) 16px}
.menu-top{padding:0 0 clamp(18px,4vh,24px);flex-shrink:0}
.menu-logo{width:clamp(40px,12vw,48px);height:auto;opacity:0.7}
.menu-nav{flex:1;display:flex;width:min(100%,420px);gap:clamp(14px,4.5vw,36px);align-items:center;justify-content:space-between}
.menu-item{writing-mode:vertical-rl;text-orientation:upright;font-size:clamp(18px,5vw,22px);font-weight:700;color:var(--green-dark);text-decoration:none;letter-spacing:clamp(0.08em,0.35vw,0.15em);padding:8px 2px;transition:color 0.2s;white-space:nowrap}
.menu-item:hover{color:var(--golden);text-decoration:none}
@media(min-width:768px){#menu{padding:60px 20px 60px}.menu-logo{width:60px}.menu-item{font-size:28px;letter-spacing:0.15em;padding:8px 4px}.menu-nav{width:auto;gap:56px;justify-content:center}}

.page{background:var(--cream);flex-direction:column}
.page-dark{background:var(--green-dark);color:var(--cream)}
.page-header{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--border);flex-shrink:0}
.page-dark .page-header{border-color:rgba(255,255,255,0.1)}
.back-btn{background:none;border:none;font-size:24px;cursor:pointer;color:var(--green-dark);padding:4px 8px;line-height:1}
.page-dark .back-btn{color:var(--cream)}
.page-title{font-size:15px;font-weight:600;color:var(--green-dark);letter-spacing:0.04em}
.page-dark .page-title{color:var(--cream)}
.page-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:32px 20px 48px}
.page-sub{text-align:center;color:var(--text-light);font-size:14px;margin-bottom:24px}
.page-cta{text-align:center;margin-top:32px}

.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 32px;font-size:16px;font-weight:600;border-radius:var(--radius);border:2px solid transparent;cursor:pointer;text-decoration:none;min-height:50px;transition:background 0.2s,border-color 0.2s}
.btn:hover{text-decoration:none}
.btn-kakao{background:var(--kakao);color:var(--kakao-text)}
.btn-kakao:hover{background:#F5DC00}
.btn-green{background:var(--green);color:var(--white)}
.btn-green:hover{background:var(--green-dark)}
.btn-outline-green{background:transparent;color:var(--green);border-color:var(--green-light)}
.btn-outline-green:hover{background:var(--green);color:var(--white)}
.btn-block{display:flex;width:100%}

.about-content{max-width:560px;margin:0 auto;text-align:center}
.about-content h2{font-size:24px;color:var(--green-dark);margin-bottom:24px;position:relative;padding-bottom:14px}
.about-content h2::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:32px;height:3px;background:var(--green);border-radius:2px}
.about-content p{color:var(--text-light);margin-bottom:16px;line-height:1.9}
.about-content strong{color:var(--green-dark);font-weight:600}
.about-btns{display:flex;flex-direction:column;gap:10px;margin-top:28px;max-width:300px;margin-left:auto;margin-right:auto}

.product-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.product-card{background:var(--cream);border-radius:var(--radius);overflow:hidden}
.product-image{aspect-ratio:1;overflow:hidden;background:var(--cream-dark);position:relative}
.product-image img{width:100%;height:100%;object-fit:cover}
.product-image.no-image{display:flex;align-items:center;justify-content:center}
.product-image.no-image::after{content:'이미지 준비 중';color:var(--green-light);font-size:13px}
.product-body{padding:10px 12px;text-align:center}
.product-body h3{font-size:14px;font-weight:700;color:var(--green-dark)}
@media(min-width:768px){.product-grid{gap:24px}.product-body{padding:14px 16px}.product-body h3{font-size:16px}}

.steps{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:28px}
.step{text-align:center;padding:20px 12px;background:rgba(255,255,255,0.5);border-radius:var(--radius);border:1px solid var(--border)}
.step-n{display:block;font-size:26px;font-weight:800;color:var(--golden);margin-bottom:6px}
.step h3{font-size:15px;font-weight:700;color:var(--green-dark);margin-bottom:6px}
.step p{font-size:13px;color:var(--text-light);line-height:1.5}
.notes{max-width:480px;margin:0 auto 24px;padding:16px 20px;background:rgba(255,255,255,0.4);border-radius:var(--radius);border:1px solid var(--border)}
.notes li{position:relative;padding-left:14px;margin-bottom:4px;font-size:14px;color:var(--text-light)}
.notes li::before{content:'·';position:absolute;left:0;color:var(--golden);font-weight:700}
.notes strong{color:var(--green-dark)}
@media(min-width:768px){.steps{grid-template-columns:repeat(4,1fr)}}

.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.gallery-item{aspect-ratio:1;border-radius:8px;overflow:hidden;background:var(--cream-dark)}
.gallery-item img{width:100%;height:100%;object-fit:cover}
.gallery-item.no-image{display:flex;align-items:center;justify-content:center}
.gallery-item.no-image::after{content:'사진 준비 중';color:var(--green-light);font-size:13px}
@media(min-width:560px){.gallery-grid{grid-template-columns:repeat(3,1fr);gap:12px}}

.map-wrap{border-radius:var(--radius);overflow:hidden;margin-bottom:24px;box-shadow:0 2px 12px var(--shadow)}
.map-wrap iframe{width:100%;height:220px;display:block}
@media(min-width:768px){.map-wrap iframe{height:320px}}
.contact-info{margin-bottom:24px}
.info-row{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);font-size:15px;color:var(--text-light)}
.info-row:last-child{border-bottom:none}
.lbl{flex-shrink:0;width:44px;font-weight:700;font-size:13px;color:var(--green);padding-top:1px}
.info-row a{color:var(--text-light);text-decoration:underline;text-underline-offset:3px}
.info-row a:hover{color:var(--green)}
.contact-btns{display:flex;flex-direction:column;gap:10px;margin-bottom:32px}
.contact-footer{text-align:center;padding-top:20px;border-top:1px solid var(--border);color:var(--text-light);font-size:14px}
.contact-footer .small{font-size:12px;color:var(--text-light);opacity:0.6;margin-top:4px}