/* Little Pot micro-site V2 (1.1.0 prep build): one cream, one leaf green, one terracotta, gray text. 4 font sizes, 1 radius, 8px grid. */
@font-face{font-family:"Jua";src:url("/fonts/Jua-Regular.ttf") format("truetype");font-display:swap}
:root{--bg:#f7f1e3;--leaf:#3d7a3a;--terra:#c0623f;--ink:#4d4d48;--r:24px;--s1:32px;--s2:24px;--s3:16px;--sec:64px}
*{box-sizing:border-box}
html{color-scheme:light;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.7 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR","Segoe UI",sans-serif;word-break:keep-all;overflow-wrap:break-word}
html[data-lang="ko"] [lang="en"],html[data-lang="ko"] [lang="zh"],html[data-lang="en"] [lang="ko"],html[data-lang="en"] [lang="zh"],html[data-lang="zh"] [lang="ko"],html[data-lang="zh"] [lang="en"]{display:none!important}
html[data-lang="zh"] body{word-break:normal;overflow-wrap:anywhere}
html[data-lang="zh"] h1,html[data-lang="zh"] h2,html[data-lang="zh"] h3,html[data-lang="zh"] .num,html[data-lang="zh"] .tag,html[data-lang="zh"] summary{font-family:"PingFang SC","Hiragino Sans GB","Noto Sans SC",sans-serif;font-weight:600}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,.num,.tag{font-family:"Jua",-apple-system,"Apple SD Gothic Neo",sans-serif;font-weight:400;margin:0;color:var(--leaf)}
h1,h2,.tag,.num{font-size:32px;line-height:1.3}
h3{font-size:24px;line-height:1.4}
p{margin:0}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
section,section.wrap{padding-top:var(--sec);padding-bottom:var(--sec)}
.hero{padding-bottom:0}
a{color:var(--leaf)}
a:focus-visible,button:focus-visible,summary:focus-visible,.row:focus-visible{outline:3px solid var(--leaf);outline-offset:3px}

/* hero */
.hero{padding-top:var(--s3)}
.topbar{display:flex;justify-content:flex-end}
.langs{display:flex;gap:8px}
.langs button{font:inherit;font-size:14px;line-height:1.4;color:var(--ink);background:none;border:1px solid var(--ink);border-radius:var(--r);padding:8px 16px;cursor:pointer}
.langs button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.hero-grid{display:grid;gap:var(--s1);align-items:center;margin-top:var(--s2)}
.hero-text{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s2)}
.hero h1 img{width:min(100%,360px)}
.tag{color:var(--ink)}
.badge{display:inline-flex;align-items:center;min-height:56px;padding:0 var(--s2);border-radius:var(--r);background:var(--ink);color:var(--bg);font-size:17px;line-height:1;text-decoration:none}
.badge:hover,.badge:focus-visible{background:var(--leaf);color:var(--bg)}
.badge span{display:inline}
.avail{margin:0;font-size:14px;color:var(--ink)}
.hero-vis{display:flex;flex-direction:column;align-items:center;gap:var(--s3)}
.mascot{width:160px}
/* 1.1.1 screens */
.shot{width:min(100%,260px);border-radius:var(--r);box-shadow:0 8px 24px rgba(77,77,72,.16)}
.hero-shot{width:min(100%,300px)}
.new{margin:0;font-size:14px;line-height:1.5;color:var(--terra)}
.sub{margin:0;max-width:34em}
.cta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3) var(--s2)}
.alt{font-size:17px}

/* features */
h2{margin-bottom:var(--s1)}
.cards{display:grid;gap:0}
.card{border-top:1px solid var(--ink);padding:var(--s2) 0 var(--s1);display:flex;flex-direction:column;gap:var(--s3)}
.card h3{margin:0}
.card p{margin:0}
.newtag{font-size:14px;line-height:1.4;color:var(--terra)}
.dlgrid{display:grid;gap:var(--s1);align-items:center}
.dlgrid h3{margin:var(--s2) 0 var(--s3)}
.dlgrid h3:first-child{margin-top:0}
.dlgrid ul{margin:0 0 var(--s2);padding-left:24px}
.dlgrid li{margin:8px 0}
.char{width:160px;height:auto;justify-self:center}
.wrap ul{line-height:1.7}
/* faq */
.faq{display:grid;gap:var(--s3);max-width:720px}
details{border-top:1px solid var(--ink);padding:var(--s3) 0}
details:last-child{border-bottom:1px solid var(--ink)}
summary{cursor:pointer;font-family:"Jua",-apple-system,sans-serif;font-size:24px;line-height:1.4;color:var(--leaf);list-style:none;display:flex;justify-content:space-between;gap:var(--s3)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--terra);flex:none}
details[open] summary::after{content:"\2212"}
details p{margin-top:var(--s3)}
.wrap>ul{margin:0 0 var(--s3);padding-left:24px}
.wrap>ul li{margin:8px 0}

/* footer */
footer{padding:var(--s1) 0 var(--sec);font-size:14px;line-height:1.7}
.foot{display:flex;flex-direction:column;gap:var(--s3)}
footer nav{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s2)}

@media (min-width:768px){
  :root{--sec:96px}
  h1,h2,.tag,.num{font-size:40px}
  .hero-grid{grid-template-columns:1fr auto;gap:var(--s1)}
  .mascot{width:240px}
  .hero h1 img{width:min(100%,420px)}
  .cards{grid-template-columns:1fr 1fr;column-gap:64px}
  .dlgrid{grid-template-columns:1fr auto;gap:64px}
  .char{width:240px}
}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
.wrap>p{margin-top:var(--s3)}