/**
 * Home Page Styles
 * 메인 페이지 전용 스타일
 */

/* 도구 그리드 (4열) */
.tool-grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-4);
}

/* 태블릿 (1024px 이하) */
@media (max-width: 1024px) {
    .tool-grid-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* 모바일 (640px 이하) */
@media (max-width: 640px) {
    .tool-grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Home content list alignment */
.tool-content ul,
.tool-content ol {
    list-style-position: inside;
    padding-left: 0;
    margin-left: 0;
    margin-bottom: var(--space-4);
}

.tool-content ul li,
.tool-content ol li {
    line-height: 1.8;
    margin-bottom: var(--space-2);
}

@media (max-width: 768px) {
    .tool-content ul,
    .tool-content ol {
        list-style-position: outside;
        padding-left: 1.4rem;
        margin-left: 0;
    }

    .tool-content ul li,
    .tool-content ol li {
        padding-left: 0.1rem;
    }
}