:root{
  --bg:#F5F1E8;
  --ink:#2C2C2C;
  --muted:#6B6B6B;
  --olive:#556B2F;
  --paper:#FFFDF8;
  --card:#FFFFFF;
  --line:rgba(44,44,44,.12);
  --shadow:0 10px 30px rgba(0,0,0,.08);
  --radius:18px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:"Noto Sans KR", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--ink);
  background:radial-gradient(1200px 600px at 20% 10%, rgba(85,107,47,.12), transparent 60%),
             radial-gradient(1000px 600px at 80% 20%, rgba(44,44,44,.06), transparent 55%),
             var(--bg);
}

a{color:inherit; text-decoration:none}
a:hover{text-decoration:underline}

.container{max-width:1100px; margin:0 auto; padding:0 18px}

.skip{position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden}
.skip:focus{left:12px; top:12px; width:auto; height:auto; padding:10px 12px; background:#fff; border-radius:10px; box-shadow:var(--shadow)}

.top{
  position:sticky; top:0; z-index:50;
  backdrop-filter:saturate(180%) blur(10px);
  background:rgba(245,241,232,.72);
  border-bottom:1px solid var(--line);
}
.top__inner{display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 0}

.brand{display:flex; align-items:center; gap:10px}
.brand__mark{width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:rgba(85,107,47,.10)}
.brand__title{font-weight:800; letter-spacing:-.02em}
.brand__sub{font-size:12px; color:var(--muted)}

.nav{display:flex; gap:12px; flex-wrap:wrap}
.nav a{font-size:13px; padding:8px 10px; border-radius:999px; border:1px solid rgba(44,44,44,.10); background:rgba(255,255,255,.55)}
.nav a:hover{text-decoration:none; background:#fff}

.main{padding-bottom:40px}

.hero{padding:34px 0 10px}
.hero__grid{display:grid; grid-template-columns: 1.4fr .9fr; gap:18px; align-items:start}

.chip{display:inline-flex; gap:8px; align-items:center; padding:10px 12px; border-radius:999px; background:rgba(255,255,255,.7); border:1px solid var(--line)}

.hero__h1{margin:14px 0 10px; font-size:46px; line-height:1.05; letter-spacing:-.04em}
.accent{color:var(--olive)}
.hero__p{margin:0; color:rgba(44,44,44,.85); line-height:1.7}

.countdown{margin-top:16px; display:flex; align-items:stretch; gap:10px; flex-wrap:wrap}
.countdown__box{min-width:160px; padding:12px 14px; border-radius:var(--radius); background:var(--paper); border:1px solid var(--line); box-shadow:0 6px 18px rgba(0,0,0,.06)}
.countdown__label{font-size:12px; color:var(--muted)}
.countdown__value{font-size:26px; font-weight:800; letter-spacing:-.02em; margin-top:6px}
.countdown__hint{width:100%; font-size:12px; color:var(--muted)}

.cta{margin-top:16px; display:flex; gap:10px; flex-wrap:wrap}
.btn{display:inline-flex; align-items:center; justify-content:center; padding:12px 14px; border-radius:14px; background:var(--olive); color:#fff; border:1px solid rgba(0,0,0,.08); font-weight:700}
.btn:hover{text-decoration:none; filter:brightness(.98)}
.btn--ghost{background:rgba(255,255,255,.75); color:var(--ink)}

.note{margin-top:14px; font-size:13px; color:var(--muted); padding:12px 14px; border-radius:14px; background:rgba(255,255,255,.55); border:1px dashed rgba(44,44,44,.18)}

.card{background:rgba(255,255,255,.82); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:16px 16px}
.card + .card{margin-top:12px}
.card__title{font-weight:800; margin:0 0 10px}
.card__big{white-space:pre-line; font-size:18px; line-height:1.55; margin:0 0 12px}
.card__row{display:flex; gap:8px; flex-wrap:wrap}
.pill{padding:7px 10px; border-radius:999px; background:rgba(85,107,47,.10); border:1px solid rgba(85,107,47,.18); font-size:13px}

.list{margin:0; padding-left:18px; color:rgba(44,44,44,.88); line-height:1.7}

.section{padding:36px 0}
.section--soft{background:linear-gradient(180deg, rgba(255,255,255,.35), transparent)}
.section__head{margin-bottom:14px}
.section__title{margin:0; font-size:26px; letter-spacing:-.02em}
.section__desc{margin:8px 0 0; color:var(--muted)}

.grid6{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
.tile{background:rgba(255,255,255,.80); border:1px solid var(--line); border-radius:16px; padding:14px 14px; box-shadow:0 6px 18px rgba(0,0,0,.05)}
.tile h3{margin:0 0 8px; font-size:16px}
.tile p{margin:0; color:rgba(44,44,44,.86); line-height:1.65}

.split{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px}

.card__p{margin:0 0 10px; line-height:1.7; color:rgba(44,44,44,.86)}

.bullets{margin:0; padding-left:18px; line-height:1.75; color:rgba(44,44,44,.86)}

.quote{border-radius:16px; border:1px solid rgba(85,107,47,.20); background:rgba(85,107,47,.08); padding:12px 12px; margin:10px 0}
.quote__title{font-size:12px; color:rgba(44,44,44,.7); font-weight:700}
.quote__body{font-size:18px; font-weight:900; letter-spacing:-.02em; margin-top:6px}

.diagram{display:grid; grid-template-columns:1fr; gap:10px; margin-top:10px}
.diagram__item{display:flex; justify-content:space-between; gap:12px; padding:12px 12px; border-radius:16px; border:1px solid var(--line); background:rgba(255,255,255,.76)}
.diagram__item span{font-weight:900}
.diagram__item small{color:var(--muted)}

.steps{display:grid; grid-template-columns:1fr; gap:12px}
.step{background:rgba(255,255,255,.84); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 8px 22px rgba(0,0,0,.06); padding:16px}
.step__head{display:flex; align-items:center; gap:10px}
.step__icon{width:40px; height:40px; display:grid; place-items:center; border-radius:14px; background:rgba(85,107,47,.10)}
.step h3{margin:0; font-size:18px}

.check{list-style:none; padding:0; margin:12px 0 0}
.check li{position:relative; padding-left:26px; margin:10px 0; line-height:1.7; color:rgba(44,44,44,.88)}
.check li::before{content:"✓"; position:absolute; left:0; top:0; color:var(--olive); font-weight:900}

.faq{display:grid; grid-template-columns:1fr; gap:10px}
.faq__item{background:rgba(255,255,255,.84); border:1px solid var(--line); border-radius:16px; padding:10px 12px}
.faq__item summary{cursor:pointer; font-weight:800}
.faq__body{margin-top:8px; color:var(--muted); line-height:1.7}

.tags{display:flex; flex-wrap:wrap; gap:8px}
.tag{padding:8px 10px; border-radius:999px; border:1px solid rgba(44,44,44,.14); background:rgba(255,255,255,.75); font-size:13px}

.contact{display:grid; gap:10px}
.contact__row{display:grid; grid-template-columns:90px 1fr; gap:10px; align-items:start}
.contact__k{color:var(--muted); font-weight:700}
.contact__v a{font-weight:900}

.muted{color:var(--muted)}

.footer{padding:28px 0 42px; border-top:1px solid var(--line); background:rgba(255,255,255,.28)}
.footer__inner{display:grid; gap:8px}
.footer__brand{font-weight:800}
.footer__line{color:rgba(44,44,44,.86)}
.footer__mini{color:var(--muted); font-size:12px}

@media (max-width: 980px){
  .hero__grid{grid-template-columns:1fr;}
  .hero__h1{font-size:38px}
  .grid6{grid-template-columns:repeat(2,1fr)}
  .split{grid-template-columns:1fr}
}

@media (max-width: 560px){
  .brand__sub{display:none}
  .nav{display:none}
  .hero{padding-top:22px}
  .hero__h1{font-size:32px}
  .countdown__box{min-width:140px}
  .grid6{grid-template-columns:1fr}
}


/* manifesto */
.manifesto__box{background:rgba(255,255,255,.88); border:1px solid rgba(85,107,47,.22); border-radius:22px; padding:18px; box-shadow:0 14px 34px rgba(0,0,0,.08)}
.manifesto__headline{font-weight:1000; letter-spacing:-.03em; font-size:24px; line-height:1.25; color:var(--olive)}
.manifesto__p{margin:10px 0 0; line-height:1.8; color:rgba(44,44,44,.88)}
.manifesto__grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:14px}
.manifesto__item{border-radius:18px; border:1px solid var(--line); background:rgba(255,255,255,.78); padding:12px}
.manifesto__item strong{display:block; font-size:14px; letter-spacing:-.01em}
.manifesto__item span{display:block; margin-top:6px; color:var(--muted); line-height:1.6; font-size:13px}
.manifesto__callout{margin-top:14px; border-radius:18px; padding:12px 12px; background:rgba(85,107,47,.10); border:1px dashed rgba(85,107,47,.35); color:rgba(44,44,44,.90); line-height:1.7; font-weight:700}

/* downloads */
.download{display:flex; gap:10px; flex-wrap:wrap; margin-top:10px}
.btn[aria-disabled="true"]{opacity:.55; cursor:not-allowed; pointer-events:none}

@media (max-width: 980px){
  .manifesto__grid{grid-template-columns:1fr}
}


/* beats */
.beat{margin-top:14px; padding:14px; border-radius:18px; border:1px solid var(--line); background:rgba(255,255,255,.80)}
.beat__tag{display:inline-flex; align-items:center; padding:7px 10px; border-radius:999px; background:rgba(44,44,44,.06); border:1px solid rgba(44,44,44,.10); font-weight:900; font-size:12px; letter-spacing:-.01em}
.beat__title{margin-top:10px; font-size:18px; font-weight:1000; letter-spacing:-.02em}
.beat__p{margin:8px 0 0; line-height:1.85; color:rgba(44,44,44,.88)}
.beat--final{border-color:rgba(85,107,47,.30); background:rgba(85,107,47,.06)}