:root{--sky1:#9fd8ff;--sky2:#e8f6ff;--leaf:#46b04a;--leaf2:#2f8a3a;--wood:#8a5a2b;--cream:#fff4c9;--ink:#3a2417;--orange:#f08a1c;--blue:#2a67c9}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:"Mitr","Apple SD Gothic Neo","Noto Sans KR","Hiragino Sans","Noto Sans SC",system-ui,sans-serif;color:var(--ink);background:linear-gradient(#bfe6ff,#f4fbff 40%,#e9f7e0)}
@font-face{font-family:Mitr;src:url(/fonts/Mitr-SemiBold.ttf) format("truetype");font-weight:600;font-display:swap}
a{color:var(--blue)}
.top{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:10px 18px;background:#fff8;backdrop-filter:blur(10px);border-bottom:2px solid #ffffffb0}
.brand{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--ink);text-decoration:none;font-size:18px}.brand img{border-radius:10px;box-shadow:0 2px 0 #0002}
.top nav a{margin-left:16px;color:var(--ink);text-decoration:none;font-size:14px}
.hero{position:relative;max-width:1100px;margin:0 auto;padding:36px 18px 20px;display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}
.hero h1{margin:0;font-size:clamp(36px,6vw,64px);line-height:1.05;color:#fff;-webkit-text-stroke:2px #1d5a24;paint-order:stroke fill;text-shadow:0 4px 0 #1d5a24}
.tag{margin:10px 0;font-size:clamp(18px,2.6vw,26px);color:var(--leaf2)}.lead{max-width:34em;line-height:1.6;font-size:17px;font-family:system-ui,"Apple SD Gothic Neo",sans-serif;font-weight:500}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}.store{display:inline-flex;flex-direction:column;padding:10px 20px;border-radius:16px;background:linear-gradient(#c2f566,#37a61b);color:#fff;text-decoration:none;border:3px solid #1d6612;box-shadow:0 5px 0 #15500d}
.store small{font-size:11px;opacity:.9}.store b{font-size:18px}span.store{background:linear-gradient(#fff6cf,#f6dc92);color:var(--ink);border-color:#e07a1a;box-shadow:0 5px 0 #b05a0e}
.soon{display:block;margin-top:14px;font-size:13px;opacity:.75;font-family:system-ui,sans-serif}
.scene{position:relative}.scene .island{width:100%;aspect-ratio:1/1.05;object-fit:cover;object-position:50% 18%;border-radius:28px;border:6px solid #fff;box-shadow:0 14px 30px #2a67c944;display:block}
.scene .hero1{position:absolute;left:6%;bottom:6%;width:26%}.scene .rb{position:absolute;width:15%}
section{max-width:1100px;margin:0 auto;padding:28px 18px}h2{font-size:clamp(24px,4vw,36px);margin:0 0 16px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{background:linear-gradient(#fffbe0,#ffeba1);border:4px solid var(--orange);border-radius:22px;padding:18px;box-shadow:0 6px 0 #b05a0e}
.card h3{margin:8px 0;font-size:19px}.card p{margin:0;font-size:15px;line-height:1.55;font-family:system-ui,"Apple SD Gothic Neo",sans-serif;font-weight:500}
.card img{height:84px;object-fit:contain}
.crops{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:6px 0 4px}.crops img{height:70px}
details:not(.lp){background:#fffbe8;border:3px solid #f0c75a;border-radius:16px;padding:12px 16px;margin:10px 0}details:not(.lp) summary{cursor:pointer;font-weight:600}details p{font-family:system-ui,"Apple SD Gothic Neo",sans-serif;line-height:1.6;margin:8px 0 0}
footer{background:#2f6b3a;color:#fff;margin-top:30px;padding:26px 18px}.foot{max-width:1100px;margin:0 auto;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
footer a{color:#e9ffd4;margin-right:16px;font-size:14px}.fb{display:flex;align-items:center;gap:10px;font-weight:600;font-size:18px}.fb img{border-radius:10px}
.lpwrap{margin-top:12px;display:flex;gap:10px;align-items:center;font-size:13px}.lp{position:relative}.lp,.lp[open]{background:none;border:0;padding:0;margin:0}.lp summary{font-family:system-ui,'Apple SD Gothic Neo','Noto Sans KR',sans-serif;font-weight:600;list-style:none;display:flex;gap:8px;align-items:center;background:#ffffff22;border:2px solid #ffffff55;border-radius:999px;padding:6px 14px;cursor:pointer;color:#fff}
.lp summary::-webkit-details-marker{display:none}.lp .gl svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:1.8}.lp i{border:5px solid transparent;border-top-color:#fff;margin-top:5px}
.lp ul{position:absolute;bottom:130%;left:0;margin:0;padding:6px;list-style:none;background:#fffdf0;border:3px solid var(--orange);border-radius:14px;min-width:190px;max-height:60vh;overflow:auto;box-shadow:0 8px 20px #0003}
.lp li a{font-family:system-ui,'Apple SD Gothic Neo','Noto Sans KR','Hiragino Sans','Noto Sans SC',sans-serif;font-weight:600;display:block;padding:8px 12px;color:var(--ink);text-decoration:none;border-radius:10px;margin:0;font-size:14px}.lp li a:hover,.lp li a[aria-current]{background:#ffe9a8}
.legal{max-width:820px;margin:0 auto;padding:24px 18px}.legal article{background:#fffdf2;border:4px solid #f0c75a;border-radius:22px;padding:20px 22px;font-family:system-ui,"Apple SD Gothic Neo",sans-serif;line-height:1.65;font-weight:500}
.legal h1{font-family:Mitr,sans-serif}.legal h2{font-size:20px;margin:22px 0 8px;font-family:Mitr,sans-serif}.meta{opacity:.7;font-size:13px}.note{background:#fff0c4;border-left:5px solid var(--orange);padding:10px 14px;border-radius:8px}
.tbl{overflow:auto}table{border-collapse:collapse;width:100%;font-size:14px}th,td{border:1px solid #e3c978;padding:8px;text-align:left;vertical-align:top}th{background:#ffeaa6}
@media(max-width:780px){.hero{grid-template-columns:1fr}.grid4{grid-template-columns:1fr 1fr}.top nav{display:none}}
@media(max-width:480px){.grid4{grid-template-columns:1fr}}

/* ───── 2차 개편 ───── */
.hero{grid-template-columns:1.05fr .95fr;padding-top:44px}
.pill{display:inline-block;padding:10px 22px;border-radius:999px;font-weight:600;font-size:16px;color:#fff;background:linear-gradient(#ffcb52,#f08a18);border:3px solid #9a4a0a;box-shadow:0 5px 0 #7a3a0a;text-shadow:0 2px 0 #6a3208}
.scene{position:relative;display:flex;justify-content:center}.scene .phone{width:min(310px,72%);background:#2a1a10;border-radius:38px;padding:9px;box-shadow:0 22px 44px #1d5a2455,0 0 0 4px #fff}
.phone img{display:block;width:100%;height:auto;border-radius:30px}
.fl{position:absolute;filter:drop-shadow(0 8px 10px #0003);animation:bob 3.2s ease-in-out infinite}
.hero1{left:-2%;bottom:9%;width:25%}.rb1{right:-2%;bottom:20%;width:17%;animation-delay:-.8s}.rb2{right:8%;bottom:2%;width:15%;animation-delay:-1.6s}.cr{left:4%;top:8%;width:20%;animation-delay:-2.2s}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
h2{text-align:center}.sub{max-width:34em;margin:-6px auto 22px;text-align:center;font-family:system-ui,"Apple SD Gothic Neo",sans-serif;font-weight:500;line-height:1.6}
.field{background:linear-gradient(#e9f7d6,#cdeaa8);border-radius:36px;margin:20px auto;max-width:1100px;border:4px solid #fff}
.plants{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.plant{position:relative;height:190px}.soil{position:absolute;left:8%;right:8%;bottom:6px;height:44px;border-radius:50%;background:radial-gradient(#7a4a22,#4a2a14);box-shadow:0 4px 0 #2f1a0c}
.plant img{position:absolute;left:50%;bottom:20px;height:150px;transform:translateX(-50%) scale(.2);transform-origin:50% 100%;opacity:0;animation:grow 7.2s ease-in-out infinite;animation-delay:var(--d)}
.plant .s1{animation-name:grow1}.plant .s2{animation-name:grow2}
@keyframes grow{0%{opacity:0;transform:translateX(-50%) scale(.2)}8%,26%{opacity:1;transform:translateX(-50%) scale(.75)}34%,100%{opacity:0;transform:translateX(-50%) scale(.75)}}
@keyframes grow1{0%,26%{opacity:0;transform:translateX(-50%) scale(.6)}34%,58%{opacity:1;transform:translateX(-50%) scale(.9)}66%,100%{opacity:0;transform:translateX(-50%) scale(.9)}}
@keyframes grow2{0%,58%{opacity:0;transform:translateX(-50%) scale(.7)}68%{opacity:1;transform:translateX(-50%) scale(1.12)}74%,92%{opacity:1;transform:translateX(-50%) scale(1)}100%{opacity:0;transform:translateX(-50%) scale(1)}}
.zones{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.zone{position:relative;background:linear-gradient(#fffbe0,#ffeba1);border:4px solid var(--orange);border-radius:22px;padding:12px;box-shadow:0 6px 0 #b05a0e;text-align:center}
.zimg{position:relative;height:150px;display:flex;align-items:center;justify-content:center}.zpic{max-height:100%;max-width:100%;animation:pic 6s ease-in-out infinite;animation-delay:var(--d)}
.vines{position:absolute;inset:0;animation:vine 6s ease-in-out infinite;animation-delay:var(--d);pointer-events:none}.lf{position:absolute;width:44%}.l0{left:6%;top:18%;transform:rotate(-30deg)}.l1{left:30%;top:2%;transform:rotate(10deg)}.l2{right:6%;top:20%;transform:rotate(35deg)}.l3{left:28%;top:40%;transform:rotate(-8deg)}
.zb,.za{display:block;font-size:14px;font-weight:600;margin-top:6px;transition:opacity .3s}.za{position:absolute;left:0;right:0;bottom:12px;opacity:0;animation:lab 6s infinite;animation-delay:var(--d);color:#2f8a3a}.zb{animation:lab2 6s infinite;animation-delay:var(--d)}
@keyframes pic{0%,30%{filter:brightness(.55) saturate(.6)}45%,85%{filter:none}100%{filter:brightness(.55) saturate(.6)}}
@keyframes vine{0%,30%{opacity:1;transform:none}48%{opacity:0;transform:translateY(-26px) scale(1.2)}85%{opacity:0}100%{opacity:1}}
@keyframes lab{0%,40%{opacity:0}50%,85%{opacity:1}95%,100%{opacity:0}}@keyframes lab2{0%,38%{opacity:1}46%,88%{opacity:0}96%,100%{opacity:1}}
.gallery{display:flex;gap:18px;overflow-x:auto;padding:6px 4px 18px;scroll-snap-type:x mandatory}.gallery .phone{flex:0 0 min(240px,62vw);background:#2a1a10;border-radius:34px;padding:8px;box-shadow:0 14px 28px #0003;scroll-snap-align:center}
.friends{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.friend{text-align:center;background:linear-gradient(#fffbe0,#ffeba1);border:4px solid var(--orange);border-radius:22px;padding:14px 10px;box-shadow:0 6px 0 #b05a0e}
.friend img{height:130px;object-fit:contain;animation:bob 3.4s ease-in-out infinite}.friend b{display:block;font-size:19px;margin-top:6px}.friend span{font-size:13px;opacity:.75;font-family:system-ui,sans-serif}
@media(max-width:780px){.hero{grid-template-columns:1fr}.plants{grid-template-columns:repeat(3,1fr)}.zones{grid-template-columns:1fr 1fr}.friends{grid-template-columns:1fr 1fr}.hero{padding-top:24px}.scene{margin-top:10px}.plant{height:170px}.plant img{height:130px}}
@media(prefers-reduced-motion:reduce){.fl,.plant img,.zpic,.vines,.friend img{animation:none}.plant .s2{opacity:1;transform:translateX(-50%) scale(1)}.vines{opacity:0}.za{opacity:1}.zb{display:none}}