.hangulat-page{}

.hangulat-hero .hero-grid{display:grid;grid-template-columns:60% 40%;gap:var(--space-3);align-items:start}
.hero-headline h1{max-width:12ch}
.hero-intro{max-width:32ch}
.hero-sub{max-width:40ch;margin-top:var(--space-3)}
.hero-collage img{width:100%}
.hero-collage img:hover{border-width:6px}

.hangulat-features .features-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}
.hangulat-features .card:hover{background:var(--color-vivid-yellow)}

.hangulat-timeline .timeline{display:flex;gap:var(--space-3);justify-content:space-between}
.hangulat-timeline .step{flex:1 1 0;min-width:0;text-align:center}
.marker{display:block;width:24px;height:24px;background:var(--color-vivid-yellow);border:var(--border-thick) solid var(--color-ink-black);margin:0 auto var(--space-2)}

.hangulat-space .space-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);align-items:center}
.space-text p{max-width:36ch}

.hangulat-people .card:hover{transform:translate(8px,8px);box-shadow:none}

.hangulat-food .food-text{max-width:50ch;margin-inline:auto;text-align:center}

.hangulat-real .real-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);align-items:center}
.real-text p{max-width:34ch}

.hangulat-audience .audience-text{max-width:60ch}

.hangulat-cta .cta-inner{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);text-align:center}

@media (max-width:1024px){
.hangulat-hero .hero-grid{grid-template-columns:1fr}
.hero-intro,.hero-sub{max-width:100%}
.hangulat-features .features-grid{grid-template-columns:1fr}
.hangulat-timeline .timeline{flex-direction:column}
.hangulat-space .space-grid{grid-template-columns:1fr}
.hangulat-real .real-grid{grid-template-columns:1fr}
}