/* 시작 (StartScreen) */
#start .hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:48px;margin-top:clamp(8px,2vw,32px)}
#start h1{font-family:var(--display);font-weight:400;font-size:clamp(44px,4.4vw,80px);line-height:1.2;margin:0 0 20px;color:var(--ink);text-wrap:balance}
#start h1 em{font-style:normal;color:var(--stem)}
#start .lead{font-size:20px;color:var(--muted);max-width:30em;margin:0 0 34px}
.histbtn{margin-left:auto}
.steps{display:flex;gap:16px;flex-wrap:wrap;margin-top:40px}
.step{display:flex;align-items:center;gap:10px;background:var(--card);border-radius:20px;padding:10px 18px 10px 10px}
.step img{width:52px;height:52px;object-fit:contain}
.step span{font-family:var(--display);font-size:18px}
.step i{font-style:normal;color:var(--muted);font-size:13px;display:block;font-family:var(--body)}
.stage{position:relative;display:grid;place-items:center;aspect-ratio:1;max-width:100%}
.blob{position:absolute;inset:6%;background:var(--leaf-soft);border-radius:47% 53% 44% 56%/52% 45% 55% 48%}
.stage .main{position:relative;width:62%;animation:bob 3.4s ease-in-out infinite}
.stage .orbit{position:absolute;width:23%;filter:drop-shadow(0 6px 10px rgba(75,122,60,.12))}
.o1{left:2%;top:12%}.o2{right:0;top:20%}.o3{right:6%;bottom:6%}
.bubble-tip{position:absolute;left:8%;bottom:14%;background:var(--card);border-radius:22px 22px 22px 6px;padding:14px 20px;font-family:var(--display);font-size:19px;color:var(--stem);box-shadow:0 6px 18px rgba(75,122,60,.12)}
@media (max-width:900px){#start .hero{grid-template-columns:1fr}}

/* 말씨와 시작하기: 진한 초록 + 흰 글자로 대비를 크게 */
#go{position:relative;overflow:hidden;font-size:24px;padding:18px 48px;background:#2d5a23;color:#fff;box-shadow:0 5px 0 #1d3d16;transition:transform .15s,box-shadow .15s}
/* 밝은 빛줄기가 사선으로 한 번씩 지나감 (크기는 그대로) */
#go::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-45%;width:38%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-22deg);animation:shine 3.2s ease-in-out infinite;pointer-events:none}
@keyframes shine{0%{left:-45%}45%,100%{left:130%}}
#go:hover{transform:translateY(-2px);box-shadow:0 7px 0 #1d3d16}
#go:active{transform:translateY(3px);box-shadow:0 2px 0 #1d3d16}
